/* MexSEO Spotlight · WordPress layer
   Styles for things the static design did not need: WordPress content classes, Contact Form 7,
   pagination output, the admin bar, the dropdown state and old Bootstrap-built pages. */

/* ---------- header, dropdowns, admin bar ---------- */
.nav__item.is-open .nav__menu { opacity: 1; visibility: visible; transform: none; }
.nav__link[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav__link svg { transition: transform 0.2s var(--ease); }
.admin-bar .site-header { top: 32px; }
.admin-bar .read-progress { top: calc(var(--header-h) + 32px); }
.admin-bar .subnav, .admin-bar .az-bar { top: calc(var(--header-h) + 32px); }
@media (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
  .admin-bar .read-progress, .admin-bar .subnav, .admin-bar .az-bar { top: calc(var(--header-h) + 46px); }
}
@media (max-width: 600px) {
  .admin-bar .site-header { top: 0; }
  .admin-bar .read-progress, .admin-bar .subnav, .admin-bar .az-bar { top: var(--header-h); }
}

/* ---------- footer ---------- */
.site-footer__about { margin-top: 1.1rem; max-width: 22rem; }
.site-footer__social { list-style: none; display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; }

/* ---------- shared bits ---------- */
.row-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.4rem; }
.no-results { display: none; padding: 2rem 0; color: var(--slate); }
.no-results.is-visible { display: block; }
.cta__title { margin-top: 1rem; }
.cta__lede { margin-top: 1.3rem; }
.card-title-link { color: inherit; text-decoration: none; }
.card-title-link:hover { text-decoration: underline; text-decoration-color: var(--lamp); text-decoration-thickness: 3px; }
.person__name a { color: inherit; text-decoration: none; }
.person__name a:hover { text-decoration: underline; }
a.tag { text-decoration: none; }
a.tag:hover { background: var(--glow); }
.search-form { margin-top: 1.4rem; }
.searchbar .btn { flex: none; }
.lost .search-form { margin-top: 2.2rem; }
.related { padding-top: clamp(3rem, 2rem + 3vw, 5rem); }
.inline-cta { margin-top: 3rem; }
.pager .dots { border-color: transparent; background: none; }
.pager .prev, .pager .next { font-weight: 800; }
.no-results a { color: var(--link); }
.tool-card__icon { width: 3.2rem; height: 3.2rem; margin: auto; color: var(--lamp); }
.ways__text { color: var(--slate); }
.contact-form-wrap { position: relative; z-index: 1; }
.contact-form-wrap .form-card h2 { font-size: 1.5rem; }

/* dark sections: links inside white cards keep the light-surface link colour */
.dark .form-card a:not(.btn), .dark .definition a:not(.btn) { color: var(--link); }

/* ---------- WordPress content ---------- */
.prose img { height: auto; }
.prose iframe, .prose video, .prose embed, .prose object { max-width: 100%; }
.prose iframe { border: 0; border-radius: var(--r); }
.prose h4 { font-size: 1.1rem; font-stretch: 108%; letter-spacing: -0.01em; line-height: 1.3; margin-top: 1.7em; color: var(--ink); }
.prose h5, .prose h6 { font-size: 1rem; margin-top: 1.5em; color: var(--ink); }
.prose h4 + *, .prose h5 + *, .prose h6 + * { margin-top: 0.6em; }
.prose pre { overflow-x: auto; padding: 1rem 1.2rem; border-radius: var(--r); background: var(--night); color: #fff; font-family: var(--mono); font-size: 0.85rem; line-height: 1.6; }
.prose pre code { padding: 0; background: none; color: inherit; }
.prose hr { border: 0; height: 1px; background: var(--line); margin: 2.4em 0; }
.prose dl { display: grid; gap: 0.4em; }
.prose dt { font-weight: 700; color: var(--ink); }
.prose dd { margin: 0 0 0.6em; }
.prose .wp-block-table { margin: 1.8em 0; overflow-x: auto; }
.prose .wp-block-image img, .prose figure img { border-radius: var(--r); }
.alignleft { float: left; margin: 0.4em 1.5em 1em 0; max-width: 50%; }
.alignright { float: right; margin: 0.4em 0 1em 1.5em; max-width: 50%; }
.aligncenter { margin-inline: auto; display: block; }
.alignnone { max-width: 100%; }
.prose::after { content: ""; display: table; clear: both; }
.wp-caption { max-width: 100%; }
.wp-caption img { margin-inline: auto; }
.wp-caption-text, .wp-element-caption { margin-top: 0.7rem; font-size: 0.88rem; color: var(--slate); text-align: center; }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: 0.8rem; }
.gallery-item { margin: 0; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.screen-reader-text:focus { position: static !important; width: auto; height: auto; clip: auto; }
@media (max-width: 640px) { .alignleft, .alignright { float: none; margin: 1em 0; max-width: 100%; } }

/* ---------- text pages ---------- */
.legal-layout--single { grid-template-columns: minmax(0, 1fr); }
.legal-layout--single .legal-body { max-width: 48rem; }
.legal-head .meta { color: var(--slate); }

/* ---------- glossary term ---------- */
.definition__q { margin: 0 0 0.9rem; font-family: var(--mono); font-size: 0.72rem; font-weight: 500; font-stretch: 100%; letter-spacing: 0.06em; line-height: 1.5; text-transform: uppercase; color: var(--slate); }
.definition__q + p { font-size: clamp(1.2rem, 1rem + 0.9vw, 1.6rem); font-weight: 600; font-stretch: 104%; line-height: 1.4; letter-spacing: -0.01em; }
.definition--long p:first-child, .definition--long .definition__q + p { font-size: clamp(1.04rem, 0.97rem + 0.4vw, 1.24rem); font-weight: 500; line-height: 1.55; letter-spacing: 0; }
.prevnext span:empty { display: block; }

/* ---------- about: writers ---------- */
.writers { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 30rem), 1fr)); gap: 1.25rem; }
.writer { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 1.2rem; align-items: start; }
.writer__bio { margin-top: 0.6rem; color: var(--slate); font-size: 0.97rem; }
.writer__more { margin-top: 0.9rem; }
.office__body .meta { color: var(--slate); }

/* ---------- Contact Form 7 inside the design's form card ---------- */
.wpcf7 { margin: 0; }
.author-box .person__name { color: var(--ink); }
.wpcf7 .hidden-fields-container { display: none; }
.wpcf7-form.form-card { margin: 0; }
.wpcf7-form-control-wrap { display: block; position: relative; }
.form-card .field__input.wpcf7-not-valid { border-color: #c2410c; }
.form-card .wpcf7-not-valid-tip { display: block; margin-top: 0.4rem; color: #b42318; font-size: 0.86rem; font-weight: 600; }
.form-card__submit { position: relative; display: grid; }
.form-card input[type="submit"].btn { width: 100%; font: inherit; font-family: var(--font); font-weight: 700; font-stretch: 108%; -webkit-appearance: none; appearance: none; }
.form-card .wpcf7-spinner { position: absolute; right: 1.1rem; top: 50%; margin: -12px 0 0; background-color: var(--night); }
.wpcf7 form .wpcf7-response-output { margin: 0; padding: 0.85rem 1rem; border: 1.5px solid var(--line); border-radius: var(--r-sm); font-size: 0.93rem; line-height: 1.45; color: var(--ink); }
.wpcf7 form.sent .wpcf7-response-output { border-color: #1f9d6b; background: rgba(61, 220, 151, 0.12); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output { border-color: var(--lamp); background: #fff8e6; }
.wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output { border-color: #b42318; background: #fef3f2; }
.pick-field { border: 0; padding: 0; margin: 0; min-width: 0; }
.pick-field legend { padding: 0; margin-bottom: 0.55rem; }
.pick .wpcf7-list-item { margin: 0; padding: 0; border: 0; border-radius: 0; font-weight: inherit; }
.pick .wpcf7-list-item label { display: block; cursor: pointer; }
.form-card__legal { text-align: center; font-size: 0.74rem; line-height: 1.5; color: var(--slate); }
.form-card__legal a { color: inherit; }
.grecaptcha-badge { visibility: hidden; }

/* ---------- old pages built with Bootstrap (tool pages) ---------- */
.legacy-crumbs { background: var(--snow); border-bottom: 1px solid var(--line); padding-top: 1.2rem; }
.legacy-crumbs .crumbs { margin-bottom: 1.2rem; color: var(--slate); }
.legacy-crumbs .crumbs a:hover { color: var(--ink) !important; }
.legacy-content { font-family: var(--font); color: var(--ink); background: var(--paper); padding-bottom: 3rem; }
.legacy-content h1, .legacy-content h2, .legacy-content h3 { font-family: var(--font); font-stretch: 112%; letter-spacing: -0.02em; }