/*
Theme Name: TXCSF
Theme URI: https://txcsf.org
Author: M&D Digital Marketing
Description: An editable WordPress block theme for TXCSF. Pages, navigation, headers, footers, colors, and typography use the native WordPress editors.
Version: 1.6.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: txcsf
Tags: block-patterns, full-site-editing, custom-colors, custom-logo, editor-style, wide-blocks
*/

/* Design values live in theme.json so site owners can change them in Styles. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-padding-top: 2rem;
}

body {
  margin: 0;
}

.wp-site-blocks > * {
  margin-block-start: 0;
}

.wp-site-blocks {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.wp-site-blocks > main {
  flex: 1;
}

/* Sections and columns use the available screen width. Keep prose readable
   within those wider layouts; native block layout handles alignment. */
.txcsf-section p,
.txcsf-section .wp-block-list,
.txcsf-hero p {
  max-width: 78ch;
}

.txcsf-section .wp-block-column {
  min-width: 0;
}

.txcsf-hero-grid {
  margin-block: 0;
}

.txcsf-hero-grid > .wp-block-column {
  min-width: 0;
}

.txcsf-hero-copy h1 {
  font-size: clamp(2.75rem, 4.5vw, 7rem);
  max-width: 100%;
}

.txcsf-hero-panel h2 {
  font-size: clamp(2rem, 2.5vw, 3.5rem);
}

.txcsf-hero-entry + .txcsf-hero-entry {
  padding-top: 1.5rem;
  border-top: 1px solid var(--wp--preset--color--gold);
}

.txcsf-hero-entry h3 {
  font-size: var(--wp--preset--font-size--large);
}

@media (max-width: 1100px) {
  .txcsf-hero-grid {
    flex-direction: column;
  }

  .txcsf-hero-grid > .wp-block-column {
    flex-basis: auto !important;
    width: 100%;
  }

}

a,
button,
input,
textarea,
select {
  -webkit-tap-highlight-color: transparent;
}

:where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: 3px solid var(--wp--preset--color--forest);
  outline-offset: 4px;
}

.txcsf-hero-copy :where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline-color: var(--wp--preset--color--gold);
}

/* Keep long labels and contact details usable at narrow viewport widths. */
.wp-block-site-title,
.wp-block-post-title,
.wp-block-heading {
  overflow-wrap: break-word;
}

.txcsf-header .txcsf-wordmark {
  flex-shrink: 0;
}

.txcsf-wordmark a {
  text-decoration: none;
}

.txcsf-header .wp-block-navigation {
  flex: 1 1 auto;
}

.txcsf-header .wp-block-navigation__responsive-container.is-menu-open {
  padding: var(--wp--preset--spacing--50);
}

.txcsf-header .wp-block-navigation__responsive-container-close {
  top: var(--wp--preset--spacing--50);
  right: var(--wp--preset--spacing--50);
}

.txcsf-header .wp-block-navigation-item__content {
  text-underline-offset: 0.35em;
}

.txcsf-header .wp-block-navigation-item__content:hover {
  text-decoration: underline;
}

.txcsf-footer address {
  font-style: normal;
}

.wp-block-image img {
  height: auto;
}

@media (max-width: 781px) {
  .txcsf-footer .wp-block-columns {
    gap: var(--wp--preset--spacing--50);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

/* The image and its width remain editable through the native Site Logo block. */
.txcsf-header .wp-block-site-logo,
.txcsf-footer .wp-block-site-logo {
  flex-shrink: 0;
  max-width: 100%;
}
.txcsf-header .wp-block-site-logo img,
.txcsf-footer .wp-block-site-logo img {
  display: block;
  max-width: 100%;
  height: auto;
}
@media (max-width: 600px) {
  .txcsf-header .wp-block-site-logo {
    max-width: 190px;
  }
}

/* Exact display window for version 1 in the original 941 × 2048 screenshot.
   Source bounds: x=210, y=309, width=525, height=377. No image is redrawn. */
.txcsf-screenshot-logo {
  width: var(--txcsf-logo-width);
  aspect-ratio: 525 / 377;
  overflow: hidden;
  background: transparent;
  /* White screenshot pixels blend into the section behind the logo. The
     original artwork stays intact; replacement PNG/SVG logos are unaffected. */
  mix-blend-mode: multiply;
}
.txcsf-screenshot-logo .custom-logo-link {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.wp-block-site-logo.txcsf-screenshot-logo img {
  width: 179.238095%;
  max-width: none;
  height: auto;
  transform: translate(-22.316684%, -15.087891%);
}

/* The supplied production logo is shown in full. Keep its white backdrop
   blended into the site's light sections without altering the PNG source. */
.txcsf-supplied-logo {
  background: transparent;
  mix-blend-mode: multiply;
}
