/*
Theme Name: Walla Floor Coating
Theme URI: https://wallafloorcoating.com
Author: The Web Guys
Author URI: https://thewebguys.com
Description: Custom WordPress theme for Walla Floor Coating — residential and commercial epoxy floor coating in Carmel, Indiana. The home page and the quote confirmation page are created automatically on activation, each with its own PHP template, and extra sections can be added with Genesis Custom Blocks.
Version: 1.0.4
Requires at least: 6.2
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: walla-floor-coating
Tags: business, custom-blocks, one-column
*/

/*
 * The real stylesheet is assets/css/site.css (compiled, self-contained).
 * This file carries the theme header WordPress requires, plus a few rules for
 * WordPress-generated content (classic post content, admin bar, alignment).
 */

.wp-site-blocks,
.walla-editor-content {
  color: #24262b;
}

/* Readable defaults for anything typed into the editor below a page template. */
.walla-editor-content {
  margin: 0 auto;
  width: 100%;
  max-width: 1200px;
  padding: 3rem 1.25rem;
  font-size: 1rem;
  line-height: 1.7;
}

.walla-editor-content > * + * {
  margin-top: 1.1rem;
}

.walla-editor-content h2 {
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.walla-editor-content h3 {
  font-size: 1.25rem;
  font-weight: 700;
}

.walla-editor-content a {
  color: #d0620c;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.walla-editor-content ul,
.walla-editor-content ol {
  padding-left: 1.25rem;
  list-style: disc;
}

.walla-editor-content ol {
  list-style: decimal;
}

.walla-editor-content img {
  max-width: 100%;
  height: auto;
  border-radius: 1rem;
}

.alignright {
  float: right;
  margin: 0 0 1rem 1.5rem;
}

.alignleft {
  float: left;
  margin: 0 1.5rem 1rem 0;
}

.aligncenter {
  display: block;
  margin: 0 auto 1rem;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* The admin bar must not hide the sticky header. */
body.admin-bar .walla-header {
  top: 32px;
}

@media screen and (max-width: 782px) {
  body.admin-bar .walla-header {
    top: 46px;
  }
}

.walla-video-section { position: relative; isolation: isolate; overflow: hidden; background-color: #24262b; }
.walla-video-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.walla-video-scrim { position: absolute; inset: 0; z-index: -1; background: rgba(36, 38, 43, 0.72); pointer-events: none; }

@media (prefers-reduced-motion: reduce) { .walla-video-bg { display: none; } }

@media (min-width: 64rem) {
  .walla-faq-aside { top: 11rem; }
}
/* ------------------------------------------------------------------- Logo --
   The wide wordmark carries a small "FLOOR COATING" line, so it needs a bit
   more height than the old square mark. Heights live here, not in markup. */
.walla-logo--header { height: 2.25rem; }
@media (min-width: 640px) { .walla-logo--header { height: 3.25rem; } }
.walla-logo--footer { height: 3rem; }

/* Header quote button: the compiled utility order lets the button's own
   `inline-flex` beat `hidden`, so the button leaked onto phones and wrapped
   into the logo. Hide it explicitly below the sm breakpoint. */
@media (max-width: 639.98px) { .walla-header-quote { display: none !important; } }