/*
Theme Name: Campbell's Lawn Care
Theme URI: https://campbellslawnohio.com
Author: Built for Campbell's Lawn Care
Description: Brand theme for Campbell's Lawn Care, Seville OH. Child theme of Twenty Twenty-Five. Carries the brand colors, fonts and a library of ready-made page sections (patterns) so pages can be built without writing anything.
Template: twentytwentyfive
Version: 1.2.3
Requires at least: 6.5
Tested up to: 6.8
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: campbells-lawn-care
Tags: business, landscaping, block-patterns, full-site-editing
*/

/* -------------------------------------------------------------------------
   Nearly all styling lives in theme.json, which is the correct place for a
   block theme. Only what the block editor cannot express belongs here.
   ------------------------------------------------------------------------- */

/* Eyebrow label: the small letter-spaced caps above a heading. */
.campbells-eyebrow {
  font-size: 13px;
  letter-spacing: 3px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 10px;
}

/* Card hover lift, used by the service and review patterns. */
.campbells-card {
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.campbells-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(27, 83, 44, .10);
  border-color: #dde7cf !important;
}

/* Star rating colour. */
.campbells-stars { color: #F5C842; letter-spacing: 2px; }

/* -------------------------------------------------------------------------
   FAQ accordion

   The question text lives inside the details block itself rather than in a
   child block, so it does not pick up a colour from the pattern and has to be
   set here or it inherits something unreadable.
   ------------------------------------------------------------------------- */

.wp-block-details {
  cursor: pointer;
}

.wp-block-details summary {
  color: var(--wp--preset--color--primary);
  font-weight: 600;
  font-size: 17px;
  line-height: 1.4;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

/* Hide the browser's default triangle so the custom marker below can replace it. */
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::marker { content: ''; }

.wp-block-details summary::after {
  content: '+';
  color: var(--wp--preset--color--accent);
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
  flex: 0 0 auto;
}
.wp-block-details[open] summary::after { content: '\2212'; }

.wp-block-details summary:hover { color: var(--wp--preset--color--accent-dark); }

/* The answer text. */
.wp-block-details > :not(summary) {
  color: var(--wp--preset--color--gray);
  margin-top: 12px;
}

/* Numbered step circle. */
.campbells-step-num {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #1B532C;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Fraunces, Georgia, serif;
  font-size: 22px;
  font-weight: 600;
  margin: 0 auto 16px;
}

/* -------------------------------------------------------------------------
   Header
   ------------------------------------------------------------------------- */

/* Sticky header sits above page content. */
.campbells-header {
  z-index: 100;
  backdrop-filter: blur(8px);
}

/* The wordmark is fixed text rather than the WordPress Site Title block, so
   the two-line "Campbell's / LAWN CARE" lockup from the brand guide holds
   regardless of what the site is named in Settings. */
.campbells-wordmark { margin: 0; }
.campbells-wordmark a {
  text-decoration: none;
  color: var(--wp--preset--color--primary);
}
.campbells-wordmark a:hover { color: var(--wp--preset--color--accent); }

/* Nav links: no underline until hovered. */
.campbells-header .wp-block-navigation a { text-decoration: none; }
.campbells-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent); }

.campbells-header-phone { margin: 0; white-space: nowrap; }
.campbells-header-phone a { text-decoration: none; }
.campbells-header-phone a:hover { color: var(--wp--preset--color--accent) !important; }

/* On narrow screens the phone number and quote button crowd the logo out,
   so hide the text number. The hamburger menu still contains a call link. */
@media (max-width: 900px) {
  .campbells-header-phone { display: none; }
}

/* -------------------------------------------------------------------------
   Footer
   ------------------------------------------------------------------------- */

.campbells-footer-links a {
  color: #bdbdbd;
  text-decoration: none;
}
.campbells-footer-links a:hover {
  color: var(--wp--preset--color--accent);
  text-decoration: underline;
}

/* Accessibility: a clearly visible keyboard focus ring everywhere. */
:where(a, button, input, textarea, select, summary):focus-visible {
  outline: 3px solid #6C9323;
  outline-offset: 2px;
}

/* Respect a reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
  .campbells-card { transition: none; }
  .campbells-card:hover { transform: none; }
}
