/* Páginas de conteúdo para busca orgânica (SEO). Carrega sobre o theme.css. */
.seo-page { overflow-wrap: break-word; }
.seo-page h2 { margin-bottom: 1rem; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 3.6vw, 3.3rem); font-weight: 500; letter-spacing: -.04em; }
.seo-page .section-heading { max-width: 780px; }
.seo-page .section-heading > p:last-child { color: var(--muted); }
.seo-page p { color: #3d3f36; }

/* Hero */
.seo-hero { position: relative; isolation: isolate; overflow: hidden; color: #fff; background: var(--ink); }
.seo-hero-bg { position: absolute; inset: 0 0 0 40%; z-index: -2; }
.seo-hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.seo-hero::before { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #0f0f04 12%, rgba(15,15,4,.95) 40%, rgba(15,15,4,.6) 65%, rgba(15,15,4,.15)); content: ""; }
.seo-hero-content { padding-block: 3rem 4.5rem; }
.seo-hero h1 { max-width: 820px; font-size: clamp(2.4rem, 4.8vw, 4.4rem); }
.seo-hero .eyebrow { color: #ffb35b; }
.seo-hero-copy { max-width: 640px; margin-bottom: 2rem; color: rgba(255,255,255,.88) !important; font-size: clamp(1.03rem, 1.5vw, 1.18rem); }
.seo-hero .hero-highlights { margin-top: 2.6rem; }
.seo-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin-bottom: 2.2rem; color: rgba(255,255,255,.72); font-size: .82rem; }
.seo-crumbs a { display: inline-flex; align-items: center; min-height: 44px; padding-inline: .15rem; color: rgba(255,255,255,.9); text-underline-offset: .2em; }
.seo-crumbs span { margin-inline: .25rem; }

/* Resumo */
.seo-summary { background: var(--surface); }
.seo-summary-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.seo-summary-grid > * { min-width: 0; }
.seo-answer p:not(.eyebrow) { font-size: 1.06rem; }
.seo-facts { padding: 1.6rem; background: var(--paper); border: 1px solid var(--line); border-top: 4px solid var(--orange); border-radius: var(--radius); }
.seo-facts dl { display: grid; gap: 0; margin: 0; }
.seo-facts dl > div { padding: .8rem 0; border-top: 1px solid var(--line); }
.seo-facts dl > div:first-child { border-top: 0; padding-top: 0; }
.seo-facts dt { color: var(--muted); font-size: .85rem; }
.seo-facts dd { margin: .1rem 0 0; font-weight: 800; }

/* Como funciona */
.seo-how-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.seo-how-grid > * { min-width: 0; }
.seo-steps { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; counter-reset: s; }
.seo-steps li { position: relative; display: grid; gap: .25rem; padding: 1.1rem 1.2rem 1.1rem 3.6rem; background: var(--surface); border: 1px solid var(--line); border-radius: .9rem; counter-increment: s; }
.seo-steps li::before { position: absolute; left: 1.1rem; top: 1.05rem; display: grid; place-items: center; width: 1.8rem; height: 1.8rem; color: var(--ink); background: var(--orange); border-radius: 50%; font-size: .85rem; font-weight: 850; content: counter(s); }
.seo-steps span { color: var(--muted); font-size: .95rem; }
.seo-flow { display: grid; gap: .35rem; padding: 1.4rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.seo-node { display: grid; gap: .1rem; padding: .85rem 1rem; background: var(--paper); border: 1px solid var(--line); border-radius: .7rem; }
.seo-node span { color: var(--muted); font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.seo-node.sun { border-left: 4px solid var(--orange); }
.seo-node.ctrl { border-left: 4px solid var(--ink); }
.seo-node.load { border-left: 4px solid var(--green); }
.seo-node.grid { margin-top: .7rem; border-style: dashed; }
.seo-node em { color: var(--orange-dark); font-style: normal; font-weight: 800; font-size: .85rem; }
.seo-arrow { color: var(--orange-dark); font-weight: 900; line-height: 1; text-align: center; }

/* Quando faz sentido */
.seo-when { background: var(--surface); }
.seo-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.seo-card { padding: 1.6rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.seo-card h3 { margin-bottom: .6rem; font-size: 1.25rem; }
.seo-card p { margin: 0; font-size: .95rem; }
.seo-card p a { color: var(--orange-dark); font-weight: 700; text-underline-offset: .18em; }
.seo-tag { display: inline-block; margin-bottom: .9rem; padding: .25rem .65rem; color: var(--orange-dark); background: #fff1e2; border-radius: 999px; font-size: .75rem; font-weight: 850; letter-spacing: .04em; }

/* Comparativo */
.seo-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.seo-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: .95rem; }
.seo-table th, .seo-table td { padding: .95rem 1.1rem; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.seo-table thead th { border-top: 0; font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.seo-table tbody th { font-weight: 750; width: 22%; }
.seo-swipe { display: none; margin: 0 0 .6rem; color: var(--muted) !important; font-size: .82rem; }
.seo-table td { color: #3d3f36; }
.seo-table .is-focus { background: #fff6ec; color: var(--ink); font-weight: 750; }
.seo-table thead .is-focus { color: var(--orange-dark); }

/* Dimensionamento */
.seo-sizing { background: var(--surface); }
.seo-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.seo-split > * { min-width: 0; }
.seo-callout { padding: 1.1rem 1.2rem; background: var(--paper); border-left: 4px solid var(--orange); border-radius: .6rem; }
.seo-chart { margin: 0; padding: 1.2rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.seo-chart svg { display: block; width: 100%; height: auto; aspect-ratio: 600 / 280; }
.ch-grid line { stroke: var(--line); stroke-width: 1; }
.ch-x text { fill: var(--muted); font-size: 17px; font-family: inherit; }
.ch-good { fill: rgba(255,127,0,.35); stroke: var(--orange); stroke-width: 2; }
.ch-big { fill: none; stroke: var(--orange-dark); stroke-width: 2; stroke-dasharray: 6 5; }
.ch-cut { fill: rgba(169,72,0,.28); }
.ch-load { fill: none; stroke: var(--ink); stroke-width: 3; stroke-linejoin: round; }
.seo-chart figcaption { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin-top: .9rem; color: var(--muted); font-size: .82rem; }
.seo-chart figcaption span { display: inline-flex; gap: .4rem; align-items: center; }
.seo-chart figcaption small { flex-basis: 100%; }
.seo-chart i { display: inline-block; width: 1rem; height: .7rem; border-radius: 2px; }
.k-load { background: var(--ink); height: 3px !important; }
.k-good { background: rgba(255,127,0,.45); border: 2px solid var(--orange); }
.k-big { border-top: 2px dashed var(--orange-dark); height: 0 !important; }
.k-cut { background: rgba(169,72,0,.35); }

/* Etapas */
.seo-timeline { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.seo-timeline li { padding: 1.4rem; background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--orange); border-radius: .9rem; }
.seo-timeline span { display: block; margin-bottom: .6rem; color: var(--orange-dark); font-size: .8rem; font-weight: 850; letter-spacing: .1em; }
.seo-timeline strong { display: block; margin-bottom: .4rem; font-size: 1.1rem; }
.seo-timeline p { margin: 0; font-size: .93rem; color: var(--muted); }

/* Obras */
.seo-works { background: var(--surface); }
.seo-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 240px; gap: .8rem; }
.seo-gallery figure { position: relative; margin: 0; overflow: hidden; border-radius: .9rem; background: var(--ink); }
.seo-gallery figure.wide { grid-column: 1 / -1; grid-row: span 2; }
.seo-gallery img { width: 100%; height: 100%; object-fit: cover; }
.seo-gallery figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.6rem .9rem .7rem; color: #fff; font-size: .88rem; font-weight: 750; background: linear-gradient(0deg, rgba(15,15,4,.88), transparent); }

/* FAQ */
.seo-faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.seo-faq-grid > * { min-width: 0; }
.seo-faq-list details { border-top: 1px solid var(--line); }
.seo-faq-list details:last-child { border-bottom: 1px solid var(--line); }
.seo-faq-list summary { position: relative; display: flex; align-items: center; min-height: 48px; padding: 1.1rem 2.2rem 1.1rem 0; font-weight: 750; cursor: pointer; list-style: none; }
.seo-faq-list summary::-webkit-details-marker { display: none; }
.seo-faq-list summary::after { position: absolute; right: .3rem; top: 1rem; color: var(--orange-dark); font-size: 1.3rem; font-weight: 400; content: "+"; }
.seo-faq-list details[open] summary::after { content: "−"; }
.seo-faq-list details p { margin: 0 0 1.2rem; }

/* Contato */
.seo-contact { color: #fff; background: var(--ink); }
.seo-contact .eyebrow { color: #ffb35b; }
.seo-contact .section-heading > p:last-child, .seo-contact p { color: rgba(255,255,255,.82); }
.seo-units { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.seo-unit { display: grid; align-content: start; gap: .2rem; padding: 1.8rem; border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius); background: rgba(255,255,255,.04); }
.seo-unit h3 { margin-bottom: .5rem; font-family: Georgia, "Times New Roman", serif; font-size: 1.5rem; font-weight: 500; }
.seo-unit-addr { margin-bottom: 1.2rem; font-size: .92rem; }
.seo-unit-addr a { display: inline-flex; align-items: center; min-height: 44px; color: rgba(255,255,255,.85); text-underline-offset: .2em; }
.seo-button-wa { justify-self: start; min-height: 48px; color: #fff; background: #147d3e; }
.seo-button-wa:hover { background: #106532; }
.seo-wa-icon { width: 1.15em; height: 1.15em; flex: 0 0 auto; }

/* Links relacionados */
.seo-related { padding: 3rem 0; background: var(--paper); border-top: 1px solid var(--line); }
.seo-related h2 { margin-bottom: 1.2rem !important; font-family: inherit !important; font-size: .85rem !important; font-weight: 850 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--muted); }
.seo-related ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.seo-related a { display: grid; gap: .2rem; height: 100%; min-height: 56px; padding: 1.1rem 1.2rem; background: var(--surface); border: 1px solid var(--line); border-radius: .9rem; text-decoration: none; transition: border-color .2s ease; }
.seo-related a:hover { border-color: var(--orange); }
.seo-related span { color: var(--muted); font-size: .9rem; }

@media (max-width: 960px) {
	.seo-summary-grid, .seo-how-grid, .seo-split, .seo-faq-grid { grid-template-columns: 1fr; }
	.seo-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.seo-hero-bg { inset: 0; opacity: .35; }
}
@media (max-width: 640px) {
	.seo-card-grid, .seo-timeline, .seo-units, .seo-related ul { grid-template-columns: 1fr; }
	.seo-gallery { grid-auto-rows: 170px; }
	.seo-gallery figure.wide { grid-row: span 1; }
	.seo-unit { padding: 1.4rem; }
	.seo-swipe { display: block; }
	.seo-table { min-width: 560px; font-size: .9rem; }
	.seo-button-wa { justify-self: stretch; }
}

/* ---------- Blocos SEO nas páginas solar, carregadores e papel e celulose ---------- */
.seo-kicker { display: block; margin: 0 0 1rem; font-family: Inter, Aptos, "Segoe UI", sans-serif; letter-spacing: .14em; }
.seo-page.section { scroll-margin-top: 6rem; }
.seo-split-top { align-items: start; }
.seo-note { margin-top: 1rem; color: var(--muted) !important; font-size: .85rem; }
.seo-more { display: inline-flex; align-items: center; min-height: 44px; margin-top: .6rem; padding-block: .35rem; color: var(--orange-dark); font-weight: 800; text-underline-offset: .2em; }

.seo-types { background: var(--surface); }
.seo-type-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.seo-type { display: flex; flex-direction: column; overflow: hidden; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.seo-type img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.seo-type > div { padding: 1.2rem 1.3rem 1.4rem; }
.seo-type h3 { margin-bottom: .5rem; font-size: 1.2rem; }
.seo-type p { margin: 0; font-size: .93rem; }

.seo-checks { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.seo-checks li { position: relative; display: grid; gap: .15rem; padding: .95rem 1.1rem .95rem 3rem; background: var(--surface); border: 1px solid var(--line); border-radius: .8rem; }
.seo-checks li::before { position: absolute; left: 1rem; top: .95rem; display: grid; place-items: center; width: 1.3rem; height: 1.3rem; border-radius: 50%; font-size: .75rem; font-weight: 900; }
.seo-checks li.ok::before { color: #fff; background: #147d3e; content: "✓"; }
.seo-checks li.keep::before { color: var(--ink); background: #ffd9b0; content: "!"; }
.seo-checks span { color: var(--muted); font-size: .92rem; }
.seo-bill .seo-checks li, .seo-deliver .seo-checks li { background: var(--surface); }

.seo-size { background: var(--surface); }
.seo-table-size tbody th { width: auto; }
.seo-table-size td:nth-child(2) { color: var(--ink); font-weight: 750; }

.seo-chargers { background: var(--paper); }
.seo-it41 { background: var(--surface); }
.seo-it41-card { padding: 1.5rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.seo-it41-title { margin: 0 0 1rem; color: var(--ink) !important; font-weight: 800; font-size: 1.05rem; }
.seo-it41-card ul { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.seo-it41-card li { display: grid; gap: .1rem; padding: .8rem 1rem; background: var(--surface); border-left: 4px solid var(--orange); border-radius: .6rem; }
.seo-it41-card li span { color: var(--muted); font-size: .9rem; }

.seo-ele { color: #fff; background: var(--ink); }
.seo-ele .eyebrow { color: #ffb35b; }
.seo-ele p { color: rgba(255,255,255,.85); }
.seo-ele .seo-note { color: rgba(255,255,255,.72) !important; }
.seo-ele .seo-steps { margin: 1.4rem 0 0; }
.seo-ele .seo-steps li { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.18); }
.seo-ele .seo-steps span { color: rgba(255,255,255,.78); }
.seo-ele-photos { display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: 1fr 1fr; gap: .8rem; height: clamp(420px, 50vw, 600px); }
.seo-ele-photos figure { position: relative; margin: 0; overflow: hidden; border-radius: .9rem; background: #000; }
.seo-ele-photos figure.tall { grid-row: span 2; }
.seo-ele-photos img { width: 100%; height: 100%; object-fit: cover; }
.seo-ele-photos figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.4rem .8rem .6rem; font-size: .8rem; font-weight: 750; background: linear-gradient(0deg, rgba(15,15,4,.88), transparent); }

.seo-brands { background: var(--paper); }
.seo-brand-list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.6rem; padding: 0; list-style: none; }
.seo-brand-list li { padding: .45rem .9rem; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; font-size: .9rem; font-weight: 750; }
.seo-gallery-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 260px; }

.seo-areas { background: #fff; }
.seo-area-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 2.4rem; }
.seo-area-grid article { padding-top: 1.3rem; border-top: 2px solid var(--line); }
.seo-area-grid span { display: block; margin-bottom: .8rem; color: var(--orange-dark); font-size: .8rem; font-weight: 750; }
.seo-area-grid h3 { margin-bottom: .5rem; font-family: Georgia, "Times New Roman", serif; font-size: 1.5rem; font-weight: 500; }
.seo-area-grid p { margin: 0; font-size: .93rem; color: var(--muted); }
.seo-deliver { background: #eeeee6; }
.seo-page.seo-faq { background: var(--paper); }

@media (max-width: 960px) {
	.seo-type-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.seo-area-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.seo-ele-photos { height: 460px; }
}
@media (max-width: 640px) {
	.seo-type-grid, .seo-area-grid, .seo-gallery-3 { grid-template-columns: 1fr; }
	.seo-gallery-3 { grid-auto-rows: 220px; }
	.seo-ele-photos { height: 380px; }
}
.seo-chargers .seo-table { min-width: 760px; }

/* ---------- Páginas completas: índice, gráficos e fundos ---------- */
.seo-toc { background: var(--surface); border-block: 1px solid var(--line); }
.seo-toc .container { display: flex; gap: .4rem 1rem; align-items: center; padding-block: .45rem; overflow-x: auto; scrollbar-width: none; white-space: nowrap; font-size: .88rem; }
.seo-toc span { color: var(--muted); font-size: .72rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.seo-toc a { display: inline-flex; align-items: center; min-height: 44px; padding: .45rem .35rem; color: var(--ink); font-weight: 700; text-decoration: none; }
.seo-toc a:hover { color: var(--orange-dark); }
.seo-card-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.seo-subhead { margin: 3.5rem 0 1.4rem; font-size: 1.35rem; }
.seo-note-in { margin: 0; padding: .8rem 1.1rem; border-top: 1px solid var(--line); }
.seo-table-wrap-compact { overflow-x: hidden; }
.seo-table-time { min-width: 0 !important; width: 100%; table-layout: fixed; font-size: .9rem; }
.seo-table-time th, .seo-table-time td { padding: .7rem .45rem; text-align: center; white-space: nowrap; }
.seo-table-time tbody th { width: 22%; text-align: left; }
.seo-table-phases { min-width: 720px; }
.seo-table-phases tbody th { width: 18%; }

.seo-gen { margin-top: 3.5rem; align-items: center; }
.seo-gen h3 { margin-bottom: .7rem; font-size: 1.35rem; }
.seo-bars-fig { margin: 0; padding: 1.3rem 1.2rem 1rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.seo-bars { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: .35rem; align-items: end; height: 220px; margin: 0; padding: 1.4rem 0 1.5rem; list-style: none; }
.seo-bars li { position: relative; height: 100%; min-width: 0; }
.seo-bar { position: absolute; bottom: 0; left: 0; width: 100%; height: var(--v); background: var(--orange); border-radius: 4px 4px 0 0; }
.seo-bar-v { position: absolute; bottom: calc(var(--v) + .25rem); left: 50%; transform: translateX(-50%); white-space: nowrap; color: var(--muted); font-size: .68rem; font-weight: 700; }
.seo-bar-m { position: absolute; top: calc(100% + .35rem); left: 50%; transform: translateX(-50%); white-space: nowrap; color: var(--muted); font-size: .72rem; font-weight: 700; }
.seo-bars-fig figcaption { margin-top: .8rem; color: var(--muted); font-size: .82rem; }

.seo-gallery-6 { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 200px; }
.seo-gallery-6 figure.wide { grid-column: span 2; grid-row: span 2; }

.solar-page .seo-how, .mobility-page .seo-chargers { background: var(--paper); }
.seo-price, .seo-care, .seo-home, .seo-biz { background: var(--paper); }
.solar-page .seo-process, .seo-time { background: var(--surface); }
.seo-phases { background: var(--paper); }
.seo-related.seo-page h2 { margin-bottom: 1.2rem; font-family: inherit; font-size: .85rem; font-weight: 850; letter-spacing: .12em; }
.seo-related ul { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

@media (max-width: 960px) {
	.seo-card-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.seo-gallery-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.seo-card-grid-3 { grid-template-columns: 1fr; }
	.seo-gallery-6 { grid-auto-rows: 160px; }
	.seo-table-time { font-size: .82rem; }
	.seo-table-time th, .seo-table-time td { padding: .6rem .25rem; }
	.seo-bars { gap: .2rem; height: 180px; }
	.seo-bar-v { font-size: .58rem; }
	.seo-bar-m { font-size: .62rem; }
}

/* Fotos nas seções de papel e celulose */
.seo-head-media { align-items: center; margin-bottom: 3rem; }
.seo-head-media .section-heading { margin-bottom: 0; }
.seo-photo { position: relative; margin: 0; overflow: hidden; border-radius: var(--radius); background: var(--ink); box-shadow: var(--shadow); }
.seo-photo img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.seo-photo figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.6rem 1rem .8rem; color: #fff; font-size: .82rem; font-weight: 750; background: linear-gradient(0deg, rgba(15,15,4,.88), transparent); }
.seo-photo-gap { margin-top: 2rem; }

/* Galeria em campo (papel e celulose) */
.seo-field { background: var(--ink); color: #fff; }
.seo-field .eyebrow { color: #ffb35b; }
.seo-field .section-heading > p:last-child { color: rgba(255,255,255,.82); }
.seo-field-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 210px; gap: .8rem; }
.seo-field-grid figure { position: relative; margin: 0; overflow: hidden; border-radius: var(--radius); background: #000; }
.seo-field-grid figure.wide { grid-column: span 2; grid-row: span 2; }
.seo-field-grid figure.tall { grid-row: span 2; }
.seo-field-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.seo-field-grid figure:hover img { transform: scale(1.04); }
.seo-field-grid figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.6rem .9rem .7rem; font-size: .84rem; font-weight: 750; background: linear-gradient(0deg, rgba(15,15,4,.88), transparent); }
@media (max-width: 960px) { .seo-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 190px; } }
@media (max-width: 640px) { .seo-field-grid { grid-auto-rows: 150px; } .seo-field-grid figure.wide { grid-row: span 1; } }