/*! Theme Name: Kadence Theme URI: https://www.kadencewp.com/kadence-theme/ Author: Kadence WP Author URI: https://www.kadencewp.com/ Description: Kadence Theme is a lightweight yet full featured WordPress theme for creating beautiful fast loading and accessible websites, easier than ever. It features an easy to use drag and drop header and footer builder to build any type of header in minutes. It features a full library of gorgeous starter templates that are easy to modify with our intelligent global font and color controls. With extensive integration with the most popular 3rd party plugins, you can quickly build impressive ecommerce websites, course websites, business websites, and more. Version: 1.5.0 License: GNU General Public License v3.0 (or later) License URI: https://www.gnu.org/licenses/gpl-3.0.html Text Domain: kadence Requires at least: 6.3 Tested up to: 6.9.1 Tags: translation-ready, accessibility-ready, two-columns, right-sidebar, left-sidebar, footer-widgets, blog, custom-logo, custom-background, custom-menu, rtl-language-support, editor-style, threaded-comments, custom-colors, featured-images, wide-blocks, full-width-template, theme-options, e-commerce Requires PHP: 7.4 This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. */ /* ============================================================ THE CDAVIDS — Shared Style System Copy into WordPress Customizer > Additional CSS or enqueue via your child theme's style.css ============================================================ */ /* --- Google Fonts (add to ) --- */ /* Force override Kadence default styles */ !important :root { --green-dark: #1e4a1e !important; --green-mid: #3a7a3a !important; --green-light: #7ec96b !important; --green-pale: #f0f7f0 !important; --sand: #fef3da !important; --sand-dark: #f0e5c8 !important; --teal: #5bbcd4 !important; --teal-dark: #0a6080 !important; --teal-pale: #ddf0f8 !important; --amber: #c87800 !important; --coral: #e8a87c !important; --pink: #e87c9a !important; --pink-pale: #fce8f2 !important; --white: #ffffff !important; --off-white: #fdfaf5 !important; --border: #d8d3cb !important; --text-dark: #0d2d0d !important; --text-body: #2a3a2a !important; --text-muted: #5a6a5a !important; --font-serif: 'Playfair Display', Georgia, serif !important; --font-sans: 'Lato', Arial, Helvetica, sans-serif !important; } body { font-family: var(--font-sans) !important; color: var(--text-body) !important; background: var(--off-white) !important; } .section { padding: 60px 24px !important; } .section-inner { max-width: 1100px !important; margin: 0 auto !important; } .btn-primary { background-color: var(--green-dark) !important; color: white !important; border: 2px solid var(--green-dark) !important; padding: 12px 24px !important; border-radius: 24px !important; } :root { /* Brand Colors */ --green-dark: #1e4a1e; --green-mid: #3a7a3a; --green-light: #7ec96b; --green-pale: #f0f7f0; --sand: #fef3da; --sand-dark: #f0e5c8; --teal: #5bbcd4; --teal-dark: #0a6080; --teal-pale: #ddf0f8; --amber: #c87800; --coral: #e8a87c; --pink: #e87c9a; --pink-pale: #fce8f2; --white: #ffffff; --off-white: #fdfaf5; --border: #d8d3cb; --text-dark: #0d2d0d; --text-body: #2a3a2a; --text-muted: #5a6a5a; /* Typography */ --font-serif: 'Playfair Display', Georgia, serif; --font-sans: 'Lato', Arial, Helvetica, sans-serif; /* Spacing */ --section-pad: 60px 24px; --card-radius: 12px; --btn-radius: 24px; } /* --- Reset & Base --- */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; } body { font-family: var(--font-sans); font-size: 16px; color: var(--text-body); background: var(--off-white); line-height: 1.7; } img { max-width: 100%; height: auto; display: block; } a { color: var(--teal-dark); } /* --- Accessibility --- */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } :focus-visible { outline: 3px solid var(--amber); outline-offset: 3px; border-radius: 3px; } a:focus-visible, button:focus-visible { outline: 3px solid var(--amber); outline-offset: 3px; } /* --- Affiliate Disclosure Bar --- */ .aff-bar { background: var(--green-pale); border-bottom: 1px solid #c8dcc8; padding: 6px 24px; text-align: center; font-size: 12px; color: #2a4a2a; } .aff-bar a { color: var(--green-dark); font-weight: 700; } /* --- Navigation --- */ .site-nav { background: var(--white); border-bottom: 1px solid var(--border); padding: 0 24px; display: flex; align-items: center; justify-content: space-between; height: 64px; position: sticky; top: 0; z-index: 100; } .nav-logo .logo-the { font-family: var(--font-serif); font-style: italic; font-size: 12px; color: var(--green-dark); line-height: 1; } .nav-logo .logo-main { font-family: var(--font-sans); font-weight: 700; font-size: 20px; color: var(--green-dark); letter-spacing: 2px; line-height: 1; } .nav-logo .logo-sub { font-size: 8px; color: var(--green-dark); letter-spacing: 2px; margin-top: 2px; } .nav-links { display: flex; gap: 20px; list-style: none; } .nav-links a { color: var(--green-dark); font-size: 13px; font-weight: 700; text-decoration: none; letter-spacing: 0.3px; } .nav-links a:hover { text-decoration: underline; } .nav-cta { background-color: var(--green-dark); color: var(--white); border: 2px solid var(--green-dark); padding: 9px 18px; border-radius: var(--btn-radius); font-size: 12px; font-weight: 700; cursor: pointer; text-decoration: none; display: inline-block; } .nav-cta:hover { background-color: var(--green-mid); border-color: var(--green-mid); color: var(--white); } /* --- Buttons --- */ .btn { display: inline-block; padding: 12px 24px; border-radius: var(--btn-radius); font-size: 14px; font-weight: 700; font-family: var(--font-sans); cursor: pointer; text-decoration: none; border: 2px solid transparent; transition: background 0.2s, border-color 0.2s, color 0.2s; } .btn-primary { background-color: var(--green-dark); color: var(--white); border-color: var(--green-dark); } .btn-primary:hover { background-color: var(--green-mid); border-color: var(--green-mid); color: var(--white); } .btn-secondary { background-color: var(--green-mid); color: var(--white); border-color: var(--green-mid); } .btn-secondary:hover { background-color: var(--green-dark); border-color: var(--green-dark); color: var(--white); } .btn-outline { background-color: transparent; color: var(--green-dark); border-color: var(--green-dark); } .btn-outline:hover { background-color: var(--green-dark); color: var(--white); } .btn-white { background-color: var(--white); color: var(--green-dark); border-color: var(--white); } .btn-white:hover { background-color: var(--green-pale); } /* --- Section Wrapper --- */ .section { padding: var(--section-pad); } .section-inner { max-width: 1100px; margin: 0 auto; } .section-label { font-size: 11px; color: var(--teal-dark); letter-spacing: 2.5px; text-transform: uppercase; font-weight: 700; margin-bottom: 8px; } .section-title { font-family: var(--font-serif); font-size: 36px; font-weight: 400; color: var(--text-dark); margin-bottom: 12px; line-height: 1.2; } .section-sub { font-size: 15px; color: var(--text-muted); max-width: 560px; } .section-header { margin-bottom: 36px; } /* Section background variants */ .section--sand { background: var(--sand); } .section--white { background: var(--white); } .section--green-dark { background: var(--green-dark); } .section--green-pale { background: var(--green-pale); } /* --- Blog Card --- */ .blog-card { background: var(--white); border-radius: var(--card-radius); border: 1px solid var(--border); overflow: hidden; transition: transform 0.2s, box-shadow 0.2s; } .blog-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.08); } .blog-card__img { aspect-ratio: 16/9; background: var(--teal-pale); display: flex; align-items: center; justify-content: center; font-size: 48px; overflow: hidden; } .blog-card__img img { width: 100%; height: 100%; object-fit: cover; } .blog-card__body { padding: 20px; } .blog-card__cat { font-size: 10px; color: var(--teal-dark); text-transform: uppercase; letter-spacing: 1.5px; font-weight: 700; margin-bottom: 6px; } .blog-card__title { font-family: var(--font-serif); font-size: 18px; color: var(--text-dark); line-height: 1.35; margin-bottom: 8px; } .blog-card__title a { text-decoration: none; color: inherit; } .blog-card__title a:hover { text-decoration: underline; } .blog-card__excerpt { font-size: 13px; color: var(--text-muted); line-height: 1.6; margin-bottom: 12px; } .blog-card__meta { font-size: 11px; color: var(--text-muted); } /* Blog grid layouts */ .blog-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } .blog-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; } @media (max-width: 768px) { .blog-grid-3, .blog-grid-2 { grid-template-columns: 1fr; } } /* --- Star Rating (Kid Experts) --- */ .star-rating { color: var(--amber); font-size: 18px; letter-spacing: 2px; } .star-rating[data-rating="1"]::before { content: "★☆☆☆☆"; } .star-rating[data-rating="2"]::before { content: "★★☆☆☆"; } .star-rating[data-rating="3"]::before { content: "★★★☆☆"; } .star-rating[data-rating="4"]::before { content: "★★★★☆"; } .star-rating[data-rating="5"]::before { content: "★★★★★"; } /* --- Page Hero --- */ .page-hero { background: var(--sand); padding: 64px 24px 48px; border-bottom: 1px solid var(--sand-dark); } .page-hero--teal { background: var(--teal-pale); } .page-hero--pink { background: var(--pink-pale); } .page-hero--green { background: var(--green-pale); } .page-hero__inner { max-width: 800px; margin: 0 auto; text-align: center; } .page-hero__eyebrow { font-size: 11px; color: var(--teal-dark); letter-spacing: 2.5px; text-transform: uppercase; font-weight: 700; margin-bottom: 12px; } .page-hero__title { font-family: var(--font-serif); font-size: 48px; font-weight: 400; color: var(--text-dark); line-height: 1.15; margin-bottom: 16px; } .page-hero__sub { font-size: 17px; color: var(--text-body); line-height: 1.7; max-width: 600px; margin: 0 auto 24px; } .page-hero__tags { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 20px; } .page-hero__tag { background: rgba(255,255,255,0.85); color: var(--text-dark); border: 1px solid var(--border); border-radius: 20px; padding: 5px 14px; font-size: 12px; font-weight: 500; } /* --- Breadcrumb --- */ .breadcrumb { font-size: 12px; color: var(--text-muted); padding: 12px 24px; background: var(--white); border-bottom: 1px solid var(--border); } .breadcrumb a { color: var(--teal-dark); text-decoration: none; } .breadcrumb a:hover { text-decoration: underline; } .breadcrumb span { margin: 0 6px; } /* --- Footer --- */ .site-footer { background: var(--green-dark); padding: 48px 24px 20px; } .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 32px; max-width: 1100px; margin: 0 auto 32px; } .footer-logo .logo-the { font-family: var(--font-serif); font-style: italic; font-size: 12px; color: #8aaa8a; } .footer-logo .logo-main { font-size: 18px; font-weight: 700; color: var(--white); letter-spacing: 2px; } .footer-logo .logo-sub { font-size: 8px; color: var(--green-light); letter-spacing: 2px; margin-top: 3px; font-weight: 700; } .footer-logo p { font-size: 12px; color: #7a9a7a; line-height: 1.6; margin-top: 12px; } .footer-col h4 { font-size: 10px; font-weight: 700; color: #a8c8a8; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 12px; } .footer-col a { display: block; font-size: 12px; color: #8aaa8a; text-decoration: none; margin-bottom: 6px; } .footer-col a:hover { color: #c8e8c8; text-decoration: underline; } .footer-bottom { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 16px; max-width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; } .footer-copy { font-size: 11px; color: #4a6a4a; } .footer-socials { display: flex; gap: 16px; } .footer-socials a { color: #6a8a6a; font-size: 18px; text-decoration: none; } .footer-socials a:hover { color: var(--green-light); } .footer-legal { max-width: 1100px; margin: 20px auto 0; padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.08); } .footer-legal p { font-size: 11px; color: #4a6a4a; line-height: 1.65; margin-bottom: 4px; } .footer-legal strong { color: #6a9a6a; } .footer-legal a { color: #6a9a6a; } /* --- Responsive --- */ @media (max-width: 900px) { .footer-grid { grid-template-columns: 1fr 1fr; } .section-title { font-size: 28px; } .page-hero__title { font-size: 36px; } } @media (max-width: 600px) { .footer-grid { grid-template-columns: 1fr; } .nav-links { display: none; } .page-hero__title { font-size: 28px; } .blog-grid-3 { grid-template-columns: 1fr; } }