/*
 * SEO checker landing page styles, shared by https://www.tkwebhosts.com/seochecker
 * and the 11 regional /{locale}/seochecker/ pages. Source file: build with
 * `npm run build:landing-css`, which writes public/landing.css (served at
 * /seochecker/landing.css and imported by app/(site)/page.tsx).
 *
 * Order mirrors root's cascade: Tailwind utilities first (regenerated under the
 * sc- prefix from components/landing), then the former page.module.css rules,
 * which win ties exactly as the module did; /v2.css loads after this file on
 * both pages.
 */

/* Regional (static) pages only: root has Tailwind's global preflight already. */
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
:where(.sc-page[data-static]), :where(.sc-page[data-static]) *,
:where(.sc-page[data-static])::before, :where(.sc-page[data-static]) *::before,
:where(.sc-page[data-static])::after, :where(.sc-page[data-static]) *::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}
:where(.sc-page[data-static])::before, :where(.sc-page[data-static]) *::before,
:where(.sc-page[data-static])::after, :where(.sc-page[data-static]) *::after {
  --tw-content: '';
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/
/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
:where(.sc-page[data-static]) hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
:where(.sc-page[data-static]) abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
:where(.sc-page[data-static]) h1,
:where(.sc-page[data-static]) h2,
:where(.sc-page[data-static]) h3,
:where(.sc-page[data-static]) h4,
:where(.sc-page[data-static]) h5,
:where(.sc-page[data-static]) h6 {
  font-size: inherit;
  font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
:where(.sc-page[data-static]) a {
  color: inherit;
  text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
:where(.sc-page[data-static]) b,
:where(.sc-page[data-static]) strong {
  font-weight: bolder;
}
/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/
:where(.sc-page[data-static]) code,
:where(.sc-page[data-static]) kbd,
:where(.sc-page[data-static]) samp,
:where(.sc-page[data-static]) pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}
/*
Add the correct font size in all browsers.
*/
:where(.sc-page[data-static]) small {
  font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
:where(.sc-page[data-static]) sub,
:where(.sc-page[data-static]) sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
:where(.sc-page[data-static]) sub {
  bottom: -0.25em;
}
:where(.sc-page[data-static]) sup {
  top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
:where(.sc-page[data-static]) table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
:where(.sc-page[data-static]) button,
:where(.sc-page[data-static]) input,
:where(.sc-page[data-static]) optgroup,
:where(.sc-page[data-static]) select,
:where(.sc-page[data-static]) textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
/*
Remove the inheritance of text transform in Edge and Firefox.
*/
:where(.sc-page[data-static]) button,
:where(.sc-page[data-static]) select {
  text-transform: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
:where(.sc-page[data-static]) button,
:where(.sc-page[data-static]) input:where([type='button']),
:where(.sc-page[data-static]) input:where([type='reset']),
:where(.sc-page[data-static]) input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:where(.sc-page[data-static]) :-moz-focusring {
  outline: auto;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:where(.sc-page[data-static]) :-moz-ui-invalid {
  box-shadow: none;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
:where(.sc-page[data-static]) progress {
  vertical-align: baseline;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
:where(.sc-page[data-static])::-webkit-inner-spin-button, :where(.sc-page[data-static]) *::-webkit-inner-spin-button,
:where(.sc-page[data-static])::-webkit-outer-spin-button, :where(.sc-page[data-static]) *::-webkit-outer-spin-button {
  height: auto;
}
/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
:where(.sc-page[data-static]) [type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
:where(.sc-page[data-static])::-webkit-search-decoration, :where(.sc-page[data-static]) *::-webkit-search-decoration {
  -webkit-appearance: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
:where(.sc-page[data-static])::-webkit-file-upload-button, :where(.sc-page[data-static]) *::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
/*
Add the correct display in Chrome and Safari.
*/
:where(.sc-page[data-static]) summary {
  display: list-item;
}
/*
Removes the default spacing and border for appropriate elements.
*/
:where(.sc-page[data-static]) blockquote,
:where(.sc-page[data-static]) dl,
:where(.sc-page[data-static]) dd,
:where(.sc-page[data-static]) h1,
:where(.sc-page[data-static]) h2,
:where(.sc-page[data-static]) h3,
:where(.sc-page[data-static]) h4,
:where(.sc-page[data-static]) h5,
:where(.sc-page[data-static]) h6,
:where(.sc-page[data-static]) hr,
:where(.sc-page[data-static]) figure,
:where(.sc-page[data-static]) p,
:where(.sc-page[data-static]) pre {
  margin: 0;
}
:where(.sc-page[data-static]) fieldset {
  margin: 0;
  padding: 0;
}
:where(.sc-page[data-static]) legend {
  padding: 0;
}
:where(.sc-page[data-static]) ol,
:where(.sc-page[data-static]) ul,
:where(.sc-page[data-static]) menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
/*
Reset default styling for dialogs.
*/
:where(.sc-page[data-static]) dialog {
  padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/
:where(.sc-page[data-static]) textarea {
  resize: vertical;
}
/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
:where(.sc-page[data-static]) input::-moz-placeholder, :where(.sc-page[data-static]) textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}
:where(.sc-page[data-static]) input::placeholder,
:where(.sc-page[data-static]) textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}
/*
Set the default cursor for buttons.
*/
:where(.sc-page[data-static]) button,
:where(.sc-page[data-static]) [role="button"] {
  cursor: pointer;
}
/*
Make sure disabled buttons don't get the pointer cursor.
*/
:where(.sc-page[data-static]) :disabled {
  cursor: default;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/
:where(.sc-page[data-static]) img,
:where(.sc-page[data-static]) svg,
:where(.sc-page[data-static]) video,
:where(.sc-page[data-static]) canvas,
:where(.sc-page[data-static]) audio,
:where(.sc-page[data-static]) iframe,
:where(.sc-page[data-static]) embed,
:where(.sc-page[data-static]) object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
:where(.sc-page[data-static]) img,
:where(.sc-page[data-static]) video {
  max-width: 100%;
  height: auto;
}
/* Make elements with the HTML hidden attribute stay hidden by default */
:where(.sc-page[data-static]) [hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}
::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}
.sc-mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.sc-mb-2 {
  margin-bottom: 0.5rem;
}
.sc-mt-3 {
  margin-top: 0.75rem;
}
.sc-mt-4 {
  margin-top: 1rem;
}
.sc-mt-6 {
  margin-top: 1.5rem;
}
.sc-mt-8 {
  margin-top: 2rem;
}
.sc-block {
  display: block;
}
.sc-inline-block {
  display: inline-block;
}
.sc-flex {
  display: flex;
}
.sc-inline-flex {
  display: inline-flex;
}
.sc-grid {
  display: grid;
}
.sc-h-10 {
  height: 2.5rem;
}
.sc-h-11 {
  height: 2.75rem;
}
.sc-h-2 {
  height: 0.5rem;
}
.sc-h-4 {
  height: 1rem;
}
.sc-w-2 {
  width: 0.5rem;
}
.sc-w-4 {
  width: 1rem;
}
.sc-max-w-3xl {
  max-width: 48rem;
}
.sc-flex-1 {
  flex: 1 1 0%;
}
.sc-items-center {
  align-items: center;
}
.sc-justify-center {
  justify-content: center;
}
.sc-gap-2 {
  gap: 0.5rem;
}
.sc-gap-3 {
  gap: 0.75rem;
}
.sc-gap-4 {
  gap: 1rem;
}
.sc-gap-8 {
  gap: 2rem;
}
.sc-space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.sc-whitespace-nowrap {
  white-space: nowrap;
}
.sc-rounded-full {
  border-radius: 9999px;
}
.sc-rounded-md {
  border-radius: calc(var(--radius) - 2px);
}
.sc-border {
  border-width: 1px;
}
.sc-border-\[\#0b559f\]\/30 {
  border-color: rgb(11 85 159 / 0.3);
}
.sc-border-input {
  border-color: hsl(var(--input));
}
.sc-bg-\[\#0b559f\] {
  --tw-bg-opacity: 1;
  background-color: rgb(11 85 159 / var(--tw-bg-opacity, 1));
}
.sc-bg-\[\#0b559f\]\/10 {
  background-color: rgb(11 85 159 / 0.1);
}
.sc-bg-\[\#f47f32\] {
  --tw-bg-opacity: 1;
  background-color: rgb(244 127 50 / var(--tw-bg-opacity, 1));
}
.sc-bg-background {
  background-color: hsl(var(--background));
}
.sc-bg-white\/10 {
  background-color: rgb(255 255 255 / 0.1);
}
.sc-px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.sc-px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.sc-px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.sc-py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.sc-py-14 {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}
.sc-py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.sc-text-center {
  text-align: center;
}
.sc-text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.sc-text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.sc-text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.sc-text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.sc-text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.sc-font-bold {
  font-weight: 700;
}
.sc-font-medium {
  font-weight: 500;
}
.sc-font-semibold {
  font-weight: 600;
}
.sc-uppercase {
  text-transform: uppercase;
}
.sc-leading-relaxed {
  line-height: 1.625;
}
.sc-leading-snug {
  line-height: 1.375;
}
.sc-tracking-\[0\.15em\] {
  letter-spacing: 0.15em;
}
.sc-text-\[\#0b559f\] {
  --tw-text-opacity: 1;
  color: rgb(11 85 159 / var(--tw-text-opacity, 1));
}
.sc-text-slate-100\/80 {
  color: rgb(241 245 249 / 0.8);
}
.sc-text-slate-500 {
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity, 1));
}
.sc-text-slate-600 {
  --tw-text-opacity: 1;
  color: rgb(71 85 105 / var(--tw-text-opacity, 1));
}
.sc-text-slate-700 {
  --tw-text-opacity: 1;
  color: rgb(51 65 85 / var(--tw-text-opacity, 1));
}
.sc-text-slate-900 {
  --tw-text-opacity: 1;
  color: rgb(15 23 42 / var(--tw-text-opacity, 1));
}
.sc-text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.sc-underline {
  text-decoration-line: underline;
}
.sc-underline-offset-2 {
  text-underline-offset: 2px;
}
.sc-ring-offset-background {
  --tw-ring-offset-color: hsl(var(--background));
}
.sc-transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
@keyframes enter {
  from {
    opacity: var(--tw-enter-opacity, 1);
    transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
  }
}
@keyframes exit {
  to {
    opacity: var(--tw-exit-opacity, 1);
    transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
  }
}
/* Explicit, so responsive and state variants stay ahead of the landing rules,
   as they do on root (globals.css loads before the page's own CSS). */
.hover\:sc-bg-\[\#083f78\]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(8 63 120 / var(--tw-bg-opacity, 1));
}
.hover\:sc-bg-\[\#0b559f\]\/5:hover {
  background-color: rgb(11 85 159 / 0.05);
}
.hover\:sc-bg-\[\#d96a20\]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(217 106 32 / var(--tw-bg-opacity, 1));
}
.hover\:sc-bg-accent:hover {
  background-color: hsl(var(--accent));
}
.hover\:sc-text-accent-foreground:hover {
  color: hsl(var(--accent-foreground));
}
.focus-visible\:sc-outline-none:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus-visible\:sc-ring-2:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:sc-ring-ring:focus-visible {
  --tw-ring-color: hsl(var(--ring));
}
.focus-visible\:sc-ring-offset-2:focus-visible {
  --tw-ring-offset-width: 2px;
}
.disabled\:sc-pointer-events-none:disabled {
  pointer-events: none;
}
.disabled\:sc-opacity-50:disabled {
  opacity: 0.5;
}
@media (min-width: 768px) {
  .md\:sc-grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:sc-grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md\:sc-text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

/* ---- former app/(site)/page.module.css ---- */

/* On root the utility was `grid`, and /v2.css's `.grid { display: grid; gap: 24px }`
   (loaded later) overrode every gap-* utility beside it. `sc-grid` no longer
   matches that rule, so its effect is reproduced here, after the utilities. */
.sc-grid {
  gap: 24px;
}
.sc-page {
  --audit-navy: #092844;
  --audit-navy-soft: #0d355c;
  --audit-blue: #0b559f;
  --audit-sky: #e8f2fa;
  --audit-orange: #f47f32;
  --audit-paper: #f7f9fb;
  --audit-white: #ffffff;
  --audit-ink: #12202d;
  --audit-muted: #526170;
  --audit-line: #d8dee4;
  min-height: calc(100vh - 64px);
  display: flex;
  flex-direction: column;
  color: var(--audit-ink);
  background: var(--audit-white);
}

.sc-page main { flex: 1; }


.sc-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: var(--audit-white);
  background: var(--audit-navy);
}

.sc-heroGrid {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.34;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(to bottom, black, transparent 88%);
          mask-image: linear-gradient(to bottom, black, transparent 88%);
}

.sc-heroShell {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
  padding-block: 52px 42px;
}

.sc-heroIntro {
  max-width: 960px;
  margin-inline: auto;
  text-align: center;
  animation: sc-audit-in 620ms cubic-bezier(.2, .8, .2, 1) both;
}

.sc-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.26);
  color: #dfeaf4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.sc-heroTitle {
  margin-top: 24px;
  color: var(--audit-white) !important;
  /* Root never loads DM Sans, so it rendered this fallback; named
     explicitly so pages that do load DM Sans render the same (owner, 2026-10-04). */
  font-family: sans-serif;
  font-size: clamp(3rem, 7vw, 5.4rem) !important;
  font-weight: 700;
  line-height: 0.98 !important;
  letter-spacing: -0.055em !important;
  text-wrap: balance;
}

.sc-heroLead {
  max-width: 850px;
  margin: 22px auto 0;
  color: #cfdeea;
  font-size: clamp(1rem, 1.7vw, 1.2rem);
  line-height: 1.65;
}

.sc-featureList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 0;
  margin-top: 22px;
  color: #e7f0f7;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 12px;
}

.sc-featureList li {
  padding: 0 14px;
  border-right: 1px solid rgba(255, 255, 255, 0.24);
}

.sc-featureList li:last-child { border-right: 0; }

.sc-scanWrap {
  margin-top: 36px;
  animation: sc-console-in 720ms 100ms cubic-bezier(.2, .8, .2, 1) both;
}


.sc-signalGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 30px;
  border-block: 1px solid rgba(255, 255, 255, 0.2);
}

.sc-signalCard {
  min-width: 0;
  padding: 18px 24px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.sc-signalCard:last-child { border-right: 0; }
.sc-signalCard > div:first-child { color: var(--audit-white); font-weight: 700; }
.sc-signalCard > div:last-child { margin-top: 4px; color: #bed0df; font-size: 13px; line-height: 1.5; }

.sc-contentSection,
.sc-processSection,
.sc-proofSection,
.sc-useCaseSection,
.sc-compareSection,
.sc-faqSection {
  color: var(--audit-ink);
  background: var(--audit-white);
}

.sc-processSection,
.sc-faqSection { background: var(--audit-paper); }
.sc-proofSection { background: var(--audit-sky); }

.sc-sectionShell,
.sc-sectionShellCompact {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
  padding-block: 64px;
}

.sc-sectionShell {
  display: flex;
  flex-direction: column;
  gap: 38px;
}

.sc-sectionShellCompact {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.sc-sectionHeading {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
}

.sc-sectionHeading > p:first-child {
  margin-bottom: 10px;
  color: var(--audit-blue) !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sc-sectionHeading h2 {
  color: var(--audit-ink) !important;
  font-size: clamp(2rem, 4vw, 3.2rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
  text-wrap: balance;
}

.sc-cardGrid,
.sc-processGrid,
.sc-quoteGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.sc-infoCard,
.sc-processCard,
.sc-quoteCard,
.sc-faqCard {
  min-width: 0;
  padding: 24px;
  background: var(--audit-white);
  border: 1px solid var(--audit-line);
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(18, 32, 45, 0.04);
}

.sc-infoCard {
  --card-accent: var(--audit-blue);
  --card-wash: #edf5ff;
  position: relative;
  overflow: hidden;
  padding: 22px 24px;
  border-top: 0;
  box-shadow: 0 10px 30px rgba(18, 32, 45, 0.06);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.sc-infoCard::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: var(--card-accent);
}

.sc-infoCard:nth-child(2) {
  --card-accent: var(--audit-orange);
  --card-wash: #fff3e9;
}

.sc-infoCard:nth-child(3) {
  --card-accent: #0b7c83;
  --card-wash: #eaf8f7;
}

.sc-infoCard:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--card-accent) 42%, var(--audit-line));
  box-shadow: 0 16px 38px rgba(18, 32, 45, 0.1);
}

.sc-infoCardHeader {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.sc-infoIcon {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
  color: var(--card-accent);
  background: var(--card-wash);
  border: 1px solid color-mix(in srgb, var(--card-accent) 24%, transparent);
  border-radius: 10px;
}

.sc-infoLabel {
  display: block;
  margin-bottom: 2px;
  color: var(--card-accent);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sc-infoChecks {
  display: grid;
  gap: 6px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--audit-line);
}

.sc-infoChecks li {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #405268;
  font-size: 13px;
}

.sc-infoChecks svg {
  flex: 0 0 auto;
  color: var(--card-accent);
}

.sc-infoCard h3, .sc-processCard h3, .sc-quoteCard h3, .sc-faqCard h3 { color: var(--audit-ink) !important; }

.sc-newsletterPanel {
  padding: 22px 28px;
  background: var(--audit-paper);
  border: 1px solid var(--audit-line);
  border-left: 5px solid var(--audit-blue);
  border-radius: 6px;
  box-shadow: none;
}

.sc-newsletterInput {
  height: 44px !important;
  border: 2px solid var(--audit-blue) !important;
  box-shadow: 0 0 0 3px rgba(0, 74, 173, 0.08) !important;
}

.sc-newsletterInput::-moz-placeholder { color: #60748d; opacity: 1; }

.sc-newsletterInput::placeholder { color: #60748d; opacity: 1; }

.sc-newsletterInput:focus-visible {
  border-color: var(--audit-orange) !important;
  outline: 3px solid rgba(245, 134, 52, 0.18) !important;
  outline-offset: 1px;
  box-shadow: none !important;
}

.sc-widgetPanel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  -moz-column-gap: 28px;
       column-gap: 28px;
  row-gap: 4px;
  padding: 24px 28px;
  text-align: left;
  background: var(--audit-navy);
  border: 0;
  border-radius: 6px;
}

.sc-widgetPanel h3 { grid-column: 1; color: var(--audit-white) !important; }
.sc-widgetPanel p { grid-column: 1; margin: 0 !important; color: #cbdbe8 !important; }
.sc-widgetPanel > div:last-child { grid-column: 2; grid-row: 1 / span 2; flex-wrap: wrap; }

.sc-processCard {
  position: relative;
  padding-top: 52px;
  border-radius: 0;
  border-width: 1px 0 0;
  background: transparent;
  box-shadow: none;
}

.sc-processCard::before {
  content: "STEP";
  position: absolute;
  top: 18px;
  left: 24px;
  color: var(--audit-orange);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.sc-quoteCard { border: 0; border-left: 3px solid var(--audit-orange); border-radius: 0; }
.sc-quoteCard blockquote { margin: 0; }

.sc-ratingLine {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  font-size: 0.95rem;
  color: var(--audit-ink);
}
.sc-ratingStars { color: var(--audit-orange); letter-spacing: 2px; font-size: 1.05rem; line-height: 1; }
.sc-ratingLink { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.sc-ratingLink:hover { color: var(--audit-orange); }

.sc-useCaseGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--audit-line);
}

.sc-useCaseCard {
  min-width: 0;
  padding: 24px;
  color: var(--audit-ink) !important;
  background: var(--audit-white);
  border-right: 1px solid var(--audit-line);
  transition: background 160ms ease, color 160ms ease;
}

.sc-useCaseCard:last-child { border-right: 0; }
.sc-useCaseCard:hover { color: var(--audit-white) !important; background: var(--audit-blue); text-decoration: none; }
.sc-useCaseCard:hover h3, .sc-useCaseCard:hover p { color: var(--audit-white) !important; }

.sc-expertiseGrid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 18px;
}

.sc-expertiseList,
.sc-differenceList {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 24px;
  list-style: none;
  background: var(--audit-white);
  border: 1px solid var(--audit-line);
  border-radius: 6px;
}

.sc-expertiseList li,
.sc-differenceList li {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 12px;
  color: var(--audit-ink);
  line-height: 1.6;
}

.sc-expertiseList li svg,
.sc-differenceList li svg { margin-top: 5px; color: var(--audit-orange); }
.sc-expertiseList strong { color: var(--audit-ink); }

.sc-differenceList { margin-top: 28px; }
.sc-differenceList li { font-size: 0.95rem; }
.sc-differenceList li + li { padding-top: 14px; border-top: 1px solid var(--audit-line); }

.sc-expertiseAside {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px;
  background: var(--audit-white);
  border: 1px solid var(--audit-line);
  border-top: 5px solid var(--audit-blue);
  border-radius: 6px;
}

.sc-expertiseStats {
  display: grid;
  gap: 12px;
  margin: 0;
}
.sc-expertiseStats div { display: flex; align-items: baseline; gap: 12px; }
.sc-expertiseStats dt {
  flex: 0 0 5.5rem;
  color: var(--audit-blue);
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
}
.sc-expertiseStats dd { margin: 0; color: var(--audit-muted); font-size: 0.9rem; }

.sc-faqGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  -moz-column-gap: 28px;
       column-gap: 28px;
}

.sc-faqCard { padding: 16px 4px; border-radius: 0; border-width: 1px 0 0; background: transparent; box-shadow: none; }
.sc-faqCard summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  list-style: none;
}
.sc-faqCard summary::-webkit-details-marker { display: none; }
.sc-faqCard summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--audit-blue);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.2;
}
.sc-faqCard[open] summary::after { content: "−"; }
.sc-faqCard summary:hover h3 { color: var(--audit-blue) !important; }
.sc-faqCard summary:focus-visible { outline: 2px solid var(--audit-blue); outline-offset: 4px; }
.sc-faqCard > p { margin-top: 10px; }

@keyframes sc-audit-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes sc-console-in {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 900px) {
  .sc-processGrid, .sc-quoteGrid, .sc-expertiseGrid { grid-template-columns: 1fr; }
  .sc-cardGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-widgetPanel { grid-template-columns: 1fr; row-gap: 12px; text-align: center; }
  .sc-widgetPanel > div:last-child { grid-column: 1; grid-row: auto; }
  .sc-useCaseGrid { grid-template-columns: repeat(2, 1fr); }
  .sc-useCaseCard:nth-child(2) { border-right: 0; }
  .sc-useCaseCard:nth-child(-n + 2) { border-bottom: 1px solid var(--audit-line); }
}

@media (max-width: 640px) {
  .sc-heroShell { padding-block: 34px 30px; }
  .sc-heroTitle { font-size: clamp(2.55rem, 13vw, 3.5rem) !important; }
  .sc-heroLead { font-size: 1rem; }
  .sc-featureList { display: grid; grid-template-columns: 1fr; justify-items: center; }
  .sc-featureList li { border-right: 0; }
  .sc-signalGrid, .sc-cardGrid { grid-template-columns: 1fr; }
  .sc-signalCard { padding-inline: 4px; border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.18); }
  .sc-signalCard:last-child { border-bottom: 0; }
  .sc-sectionShell, .sc-sectionShellCompact { padding-block: 48px; }
  .sc-newsletterPanel, .sc-widgetPanel { padding: 22px; }
  .sc-useCaseGrid { grid-template-columns: 1fr; }
  .sc-useCaseCard { border-right: 0; border-bottom: 1px solid var(--audit-line); }
  .sc-useCaseCard:last-child { border-bottom: 0; }
  .sc-faqGrid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .sc-heroIntro, .sc-scanWrap { animation: none; }
}

/* ---- regional (static) pages only ---- */
/* Root's exact Inter: the next/font files root self-hosts, copied to
   public/fonts/inter so the regional pages render identical glyph metrics
   (Google Fonts' Inter wraps two comparison lines differently). Declared under
   their own family name, so root, which never uses it, downloads nothing. */
@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-greek-ext.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-greek.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'SC Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/seochecker/fonts/inter/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Root's body text is Inter (next/font); the regional pages use the same
   files (above). Theme variables the copied Button classes read, which root
   gets from app/theme-vars.css. */
.sc-page[data-static] {
  font-family: 'SC Inter', Arial, sans-serif;
  --background: 0 0% 100%;
  --accent-foreground: 222.2 47.4% 11.2%;
  --input: 214.3 31.8% 91.4%;
  --ring: 222.2 84% 4.9%;
}

/* /v2.css gives h2 and h3 "DM Sans". Root never loads DM Sans, so its headings
   render the browser's sans-serif fallback; the regional pages do load DM Sans
   (for the site chrome), so name the fallback explicitly to match root. */
.sc-page[data-static] h2,
.sc-page[data-static] h3 {
  font-family: sans-serif;
}

/* Arabic and Hebrew pages: /v2.css keeps every layout left to right
   ([dir="rtl"] body { direction: ltr }) and turns text blocks right to left.
   Same here: root's layout stays as it is, its text reads right to left. The
   island forms stay as they are — their copy is English (owner, 2026-08-16). */
[dir="rtl"] .sc-page[data-static] :is(h1, h2, h3, p, li, dt, dd, blockquote, figcaption, summary, .sc-signalCard):not([data-seo-embed] *, [data-seo-newsletter] *, [data-seo-lead-form] *) {
  direction: rtl;
}

/* Word order. Some translated strings sit in blocks that stay left to right
   (the hero badge, card labels, buttons, the island forms), and a mix such as
   "مدقق SEO مجاني" would otherwise render its parts in reverse. plaintext lets
   each string take its direction from its own first letters: Arabic and Hebrew
   read right to left, the islands' English labels stay left to right. */
[dir="rtl"] .sc-page[data-static] :is(h1, h2, h3, h4, p, li, dt, dd, blockquote, figcaption, summary, label, button, a, span, div) {
  unicode-bidi: plaintext;
}

:where(.sc-page[data-static]),
:where(.sc-page[data-static]) * {
  border-color: hsl(214.3 31.8% 91.4%);
}
