/*
Theme Name: Kenjoh
Description: Block theme for kenjohoutdoor.com. Bold black, white and Kenjoh red; pairs with the Kenjoh Inventory plugin for the board pages, map and live numbers.
Version: 0.1.2
Requires at least: 6.5
Requires PHP: 7.4
Author: Kenjoh Outdoor Advertising
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kenjoh
*/

/* Most styling lives in theme.json; these are the few things it can't express. */

.kenjoh-logo { display: inline-flex; flex-direction: column; line-height: 1; color: #fff; text-decoration: none; }
.kenjoh-logo:hover { color: #fff; }
.kenjoh-logo__name { font-family: var(--wp--preset--font-family--archivo); font-weight: 900; font-size: 1.875rem; letter-spacing: -0.5px; }
.kenjoh-logo__tag { font-family: var(--wp--preset--font-family--archivo); font-weight: 800; font-size: 0.625rem; letter-spacing: 0.24em; margin-top: 3px; }

/* Outline button style ("is-style-outline") in Kenjoh's square look. */
.wp-block-button.is-style-outline > .wp-block-button__link { border: 1px solid currentColor; background: transparent; padding: calc(0.85rem - 1px) calc(1.4rem - 1px); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(255, 255, 255, 0.08); color: inherit; }

/* Hero headline wraps between words only. */
.kenjoh-hero h1 { overflow-wrap: normal; word-break: normal; hyphens: manual; }

/* Hero photo fills its column on wide screens. */
.kenjoh-hero .kenjoh-hero__photo { margin: 0; height: 100%; }
.kenjoh-hero .kenjoh-hero__photo img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; display: block; }

/* Numbered "how it works" steps. */
.kenjoh-step { border-top: 3px solid var(--wp--preset--color--ink); padding-top: 1.1rem; }

.wp-block-post-title.kenjoh-board-title { font-family: var(--wp--preset--font-family--mono); letter-spacing: -0.02em; }

/* Contact form (Contact Form 7) in the theme's square look. */
.wpcf7 form p { margin: 0 0 1rem; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea {
	width: 100%; box-sizing: border-box; padding: 0.85rem 1rem; border: 1px solid var(--wp--preset--color--pale); border-radius: 0;
	background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); font: inherit;
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: 2px solid var(--wp--preset--color--ink); outline-offset: 0; border-color: var(--wp--preset--color--ink); }
.wpcf7 textarea { min-height: 10rem; }
.wpcf7 input[type="submit"] {
	padding: 0.85rem 1.6rem; border: 0; border-radius: 0; cursor: pointer; background: var(--wp--preset--color--red);
	color: #fff; font-family: var(--wp--preset--font-family--archivo); font-weight: 700; font-size: 1rem;
}
.wpcf7 input[type="submit"]:hover { background: var(--wp--preset--color--red-dark); }
.wpcf7 .dfd-half-size { display: inline-block; width: calc(50% - 0.5rem); vertical-align: top; }
.wpcf7 .dfd-half-size + .dfd-half-size { margin-left: 1rem; }
@media (max-width: 600px) { .wpcf7 .dfd-half-size { display: block; width: 100%; } .wpcf7 .dfd-half-size + .dfd-half-size { margin-left: 0; } }