/*
Theme Name: Todd's Turf
Theme URI: https://toddsturf.com
Author: Todd's Turf
Description: A clean black, white and pistachio block theme for Todd's Turf lawn care. Every homepage section is an editable block pattern.
Version: 1.1.0
Requires at least: 6.6
Tested up to: 6.7
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: toddsturf
*/

/* Header */
header.wp-block-template-part { position: sticky; top: 0; z-index: 100; background: rgba(250,250,247,.96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--wp--preset--color--border); }
.admin-bar header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar header.wp-block-template-part { top: 46px; } }
.tt-header { padding: 16px 32px; }
.wp-block-site-title { font-family: var(--wp--preset--font-family--archivo); font-weight: 900; font-size: 22px; letter-spacing: -.02em; text-transform: uppercase; display: flex; align-items: center; gap: 12px; margin: 0; }
.wp-block-site-title a { color: inherit; text-decoration: none; }
.wp-block-site-title::before { content: ""; width: 12px; height: 12px; background: var(--wp--preset--color--pistachio); border-radius: 3px; transform: rotate(45deg); flex-shrink: 0; }
.tt-nav a { font-weight: 600; font-size: 15px; color: #3f423c; text-decoration: none; }
.tt-nav a:hover { color: var(--wp--preset--color--forest); }
.tt-phone { margin: 0; font-weight: 700; font-size: 15px; }
.tt-phone a { color: inherit; text-decoration: none; }
.tt-header-cta .wp-block-button__link { padding: 12px 22px; font-size: 14px; }
@media (max-width: 860px) { .tt-header-cta { display: none !important; } }

/* Buttons */
.wp-block-button.is-style-outline .wp-block-button__link { border: 2px solid currentColor; padding: 14px 28px; background: transparent; color: var(--wp--preset--color--black); }
.tt-btn-accent .wp-block-button__link { background: var(--wp--preset--color--pistachio); color: var(--wp--preset--color--black); }
.tt-btn-accent .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--black); }
.tt-hero .is-style-outline .wp-block-button__link { color: #fff; }
.tt-hero .is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--black); border-color: #fff; }

/* Hero */
.tt-hero { padding: 80px 32px !important; }
.tt-hero-content > * { max-width: 640px; }
.tt-hero h1 { font-size: clamp(38px, 6vw, 56px); line-height: 1.02; color: #fff; margin: 0 0 20px; }
p.tt-hero-sub { font-size: 19px; line-height: 1.5; color: #ebebeb; max-width: 480px; margin: 0 0 32px; }
.tt-badge { display: inline-block; background: var(--wp--preset--color--pistachio); color: var(--wp--preset--color--black); font-weight: 700; font-size: 13px; padding: 6px 14px; border-radius: 3px; margin: 0 0 20px; }

/* Sections */
.tt-section { padding: 100px 32px; }
.tt-section-head { max-width: 640px; margin-bottom: 56px !important; }
.tt-section-head h2 { margin: 0 0 12px; }
.tt-section-head p:not(.tt-eyebrow) { font-size: 17px; color: var(--wp--preset--color--gray); margin: 0; }
.tt-eyebrow { font-weight: 700; font-size: 14px; color: var(--wp--preset--color--forest); letter-spacing: .06em; text-transform: uppercase; margin: 0 0 12px; }
.has-black-background-color .tt-eyebrow { color: var(--wp--preset--color--pistachio); }
@media (max-width: 781px) { .tt-section { padding: 72px 20px; } .tt-hero { padding: 64px 20px !important; } .tt-header { padding: 14px 20px; } }

/* Service cards */
.tt-card { background: #fff; border: 1px solid var(--wp--preset--color--border); border-radius: 8px; padding: 32px 28px; }
.tt-card::before { content: ""; display: block; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(var(--wp--preset--color--forest), var(--wp--preset--color--forest)) center / 16px 16px no-repeat, var(--wp--preset--color--pistachio-light); }
.tt-card h3 { font-size: 19px; margin: 20px 0 10px; }
.tt-card p { font-size: 15px; line-height: 1.55; color: var(--wp--preset--color--gray); margin: 0; }

/* Before / after */
.tt-ba-images { gap: 4px !important; border-radius: 8px; overflow: hidden; }
.tt-ba-images figure { margin: 0 !important; position: relative; }
.tt-ba-images img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.tt-before::before, .tt-after::before { position: absolute; top: 8px; left: 8px; z-index: 1; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 3px; }
.tt-before::before { content: "BEFORE"; background: var(--wp--preset--color--black); color: #fff; }
.tt-after::before { content: "AFTER"; background: var(--wp--preset--color--pistachio); color: var(--wp--preset--color--black); }
.tt-ba-caption { font-weight: 600; font-size: 15px; margin: 14px 0 0; }

/* Service area */
.tt-chips { gap: 10px; }
.tt-chip { background: var(--wp--preset--color--pistachio-light); color: #3b5a24; font-weight: 600; font-size: 14px; padding: 8px 16px; border-radius: 100px; margin: 0; }
.tt-map iframe { width: 100%; aspect-ratio: 1/1; border: 0; border-radius: 8px; display: block; }

/* Testimonials */
.tt-testimonial { background: var(--wp--preset--color--charcoal); border-radius: 8px; padding: 32px; }
.tt-testimonial p { margin: 0; }
.tt-stars { color: var(--wp--preset--color--pistachio); letter-spacing: 2px; font-size: 15px; margin-bottom: 16px !important; }
.tt-quote { font-size: 16px; line-height: 1.6; color: #e5e5e5; margin-bottom: 20px !important; }
.tt-name { font-weight: 700; font-size: 14px; color: #fff; }
.tt-location { font-size: 13px; color: #9a9d96; margin-top: 2px !important; }

/* Quote form */
.tt-contact p { margin: 0 0 18px; line-height: 1.5; }
.tt-contact strong { display: block; }
.tt-form-card { background: #fff; border: 1px solid var(--wp--preset--color--border); border-radius: 8px; padding: 32px; }
.tt-form { display: flex; flex-direction: column; gap: 16px; }
.tt-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.tt-form input, .tt-form select, .tt-form textarea { font: inherit; font-size: 15px; padding: 12px 14px; border: 1px solid #d6d9d1; border-radius: 4px; background: #fff; color: var(--wp--preset--color--black); width: 100%; box-sizing: border-box; }
.tt-form textarea { resize: vertical; }
.tt-form input:focus, .tt-form select:focus, .tt-form textarea:focus { outline: 2px solid var(--wp--preset--color--pistachio); border-color: var(--wp--preset--color--forest); }
.tt-form button { background: var(--wp--preset--color--black); color: #fff; border: 0; padding: 16px; border-radius: 4px; font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; }
.tt-form button:hover { background: var(--wp--preset--color--pistachio); color: var(--wp--preset--color--black); }
.tt-hp { position: absolute !important; left: -9999px !important; }
.tt-form-success { text-align: center; padding: 32px 0; }
.tt-form-success h3 { margin: 0 0 8px; }
@media (max-width: 600px) { .tt-form-row { grid-template-columns: 1fr; } }

/* Footer */
.tt-footer { padding: 56px 32px 28px; }
.tt-footer p { font-size: 14px; line-height: 1.6; margin: 0 0 10px; color: #c0c3bb; }
.tt-footer a { color: #c0c3bb; text-decoration: none; }
.tt-footer a:hover { color: #fff; }
.tt-footer .tt-footer-heading { color: #fff; font-weight: 700; margin-bottom: 14px; }
.tt-footer .wp-block-site-title { font-size: 18px; color: #fff; margin-bottom: 14px; }
.tt-footer-bottom { border-top: 1px solid #343632; padding-top: 20px; margin-top: 40px !important; }
.tt-footer-bottom p { font-size: 13px; margin: 0; }

/* Multi-page additions */
.tt-full .wp-block-post-content > * { margin-block-start: 0; }
.tt-nav .wp-block-navigation__submenu-container { background: #fff !important; border: 1px solid var(--wp--preset--color--border) !important; border-radius: 6px; padding: 8px 0; min-width: 260px !important; }
.tt-nav .wp-block-navigation__submenu-container a { padding: 8px 18px !important; }
.tt-page-hero { padding: 96px 32px 80px; }
.tt-page-hero h1 { color: #fff; font-size: clamp(36px, 5vw, 52px); margin: 0 0 16px; }
.tt-page-hero p.tt-hero-sub { margin: 0; }
.tt-card { transition: border-color .15s; display: flex; flex-direction: column; }
.tt-card:hover { border-color: var(--wp--preset--color--pistachio); }
.tt-card h3 a { color: inherit; text-decoration: none; }
.tt-card p.tt-card-link { margin-top: auto; padding-top: 16px; }
.tt-card-link a { font-weight: 700; color: var(--wp--preset--color--forest); text-decoration: none; }
.tt-more-link { margin-top: 48px !important; }
.tt-photo { margin: 0; }
.tt-photo img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 8px; display: block; }
.tt-lead { font-size: 19px; line-height: 1.6; }
.tt-checklist { list-style: none; padding: 0; margin: 0 0 32px; }
.tt-checklist li { position: relative; padding: 8px 0 8px 34px; border-bottom: 1px solid var(--wp--preset--color--border); }
.tt-checklist li::before { content: "✓"; position: absolute; left: 0; top: 9px; width: 22px; height: 22px; border-radius: 50%; background: var(--wp--preset--color--pistachio); color: var(--wp--preset--color--black); font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.tt-more { padding-top: 64px; padding-bottom: 64px; }
.tt-more .tt-chip { background: #fff; }
.tt-chip a { color: inherit; text-decoration: none; }
.tt-chip a:hover { color: var(--wp--preset--color--forest); }
.tt-gallery img { border-radius: 6px; }
.tt-cta { padding: 72px 32px; }
.tt-cta h2 { margin: 0 0 8px; }
.tt-cta p { margin: 0; }
.tt-cta .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--black); }
@media (max-width: 781px) { .tt-page-hero { padding: 64px 20px 56px; } .tt-cta { padding: 56px 20px; } }