/*
Theme Name: Wedding Planning 365 Child
Theme URI: https://weddingplanning365.com/
Author: Wedding Planning 365
Author URI: https://weddingplanning365.com/
Description: Child theme of Twenty Twenty-Five for Wedding Planning 365, a shop selling a wedding planner spreadsheet. Warm, romantic styling in ivory, blush, champagne and sage. Homepage, pricing and product-page sections are added through the child theme only; the parent theme is never edited. WooCommerce cart, checkout and account pages are untouched. Version 1.0.1 adds the keyword plan: homepage targets wedding planning / wedding budget / wedding timeline / wedding checklist, each product page targets one product keyword. Version 1.0.2 adopts the Gemini headline and emotional line and adds a real wedding photograph as the hero background (images/hero-wedding-table.webp, Unsplash, free licence; see README for credit). Version 1.0.3 fixes live-site issues: pricing cards no longer break words mid-word (and the pricing section goes wide), the footer is the shop's own links instead of the Twenty Twenty-Five defaults, and the Complete Kit page lists the Setup Guide. Version 1.0.4 adds FAQPage JSON-LD for single posts from the custom field wedding365_faq_json (GEO articles); everything else is unchanged.
Version: 1.0.4
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: weddingplanning365-child
Tags: wedding, ecommerce, woocommerce, romantic, warm, serif
*/

/* ============================================================
   Wedding Planning 365 — custom styles
   All colours and fonts are managed through the variables
   below and the palette in theme.json. Change a value here
   and in theme.json together so blocks and CSS stay in sync.
   No external fonts and no external JavaScript are loaded:
   headings use an elegant system serif stack (Georgia first),
   body text uses the system sans stack.
   ============================================================ */

:root {
    --wp365-ivory: #fdf8f1;
    --wp365-ivory-deep: #f7ecdd;
    --wp365-blush: #f6dcd8;
    --wp365-blush-deep: #e9b8b2;
    --wp365-champagne: #c6a15b;
    --wp365-champagne-deep: #a9853f;
    --wp365-champagne-light: #ead9b8;
    --wp365-sage: #8a9a7b;
    --wp365-sage-deep: #6b7d5e;
    --wp365-ink: #3b3633;
    --wp365-ink-soft: #6e655e;
    --wp365-clay: #8c6d5a;
    --wp365-white: #fffdf9;
    --wp365-radius: 16px;
    --wp365-radius-lg: 24px;
}

/* ---------- Base ---------- */

body {
    background-color: var(--wp365-ivory);
    color: var(--wp365-ink);
}

h1,
h2,
h3,
.wp365-serif {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: var(--wp365-ink);
}

h1 {
    font-size: clamp(2.4rem, 6vw, 3.6rem);
    line-height: 1.12;
}

h2 {
    font-size: clamp(1.7rem, 4vw, 2.3rem);
    line-height: 1.25;
}

h3 {
    font-size: 1.25rem;
    line-height: 1.35;
}

a {
    color: var(--wp365-champagne-deep);
}

a:hover,
a:focus-visible {
    color: var(--wp365-sage-deep);
}

:focus-visible {
    outline: 3px solid var(--wp365-champagne);
    outline-offset: 2px;
}

/* ---------- Buttons: soft, rounded, champagne ---------- */

.wp-block-button__link,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    border-radius: 999px;
    padding: 0.85em 1.9em;
    font-weight: 600;
    min-height: 48px;
    line-height: 1.3;
}

.wp-block-button__link {
    background-color: var(--wp365-champagne);
    color: var(--wp365-white);
}

.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
    background-color: var(--wp365-champagne-deep);
    color: var(--wp365-white);
}

.wp365-button--ghost .wp-block-button__link {
    background-color: transparent;
    color: var(--wp365-ink);
    box-shadow: inset 0 0 0 2px var(--wp365-champagne);
}

.wp365-button--ghost .wp-block-button__link:hover,
.wp365-button--ghost .wp-block-button__link:focus-visible {
    background-color: var(--wp365-blush);
    color: var(--wp365-ink);
    box-shadow: inset 0 0 0 2px var(--wp365-champagne-deep);
}

/* WooCommerce primary buttons keep the shop usable, in theme colours. */
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt {
    background-color: var(--wp365-champagne);
    color: var(--wp365-white);
}

.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce input.button.alt:hover {
    background-color: var(--wp365-champagne-deep);
    color: var(--wp365-white);
}

/* ---------- Hero ---------- */

/* Hero background (v1.0.2): a real wedding photograph, bundled in
   this theme at images/hero-wedding-table.webp (Unsplash, free
   licence; credit in README), under a flat white veil at 40%
   opacity so the headline stays readable. The blush gradient is
   kept as the bottom layer: if the photo file is ever missing,
   the hero falls back to the v1.0.1 blush gradient with the
   champagne rings, so the hero still stands on its own. */
.wp365-hero {
    background-color: var(--wp365-ivory);
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)),
        url("images/hero-wedding-table.webp"),
        linear-gradient(160deg, var(--wp365-blush) 0%, var(--wp365-ivory) 55%, var(--wp365-ivory-deep) 100%);
    background-size: cover, cover, cover;
    background-position: center, center, center;
    border-radius: var(--wp365-radius-lg);
    padding: clamp(2.5rem, 7vw, 5rem) clamp(1.5rem, 6vw, 4rem);
    text-align: center;
    position: relative;
    overflow: hidden;
}

/* Two soft rings, purely decorative, drawn in CSS so the hero
   needs no photograph. Replace the .wp365-hero-photo slot
   (see the install guide) with a real wedding photograph when
   one is ready; the rings sit behind it. */
.wp365-hero::before,
.wp365-hero::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(198, 161, 91, 0.45);
    border-radius: 50%;
    pointer-events: none;
}

.wp365-hero::before {
    width: 340px;
    height: 340px;
    top: -170px;
    right: -90px;
}

.wp365-hero::after {
    width: 260px;
    height: 260px;
    bottom: -140px;
    left: -70px;
}

.wp365-hero > * {
    position: relative;
}

.wp365-eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--wp365-clay);
    margin-bottom: 1rem;
}

.wp365-hero-sub {
    font-size: clamp(1.05rem, 2.4vw, 1.25rem);
    line-height: 1.65;
    color: var(--wp365-ink-soft);
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
}

.wp365-hero-photo {
    border-radius: var(--wp365-radius-lg);
    overflow: hidden;
    margin-top: 2rem;
}

.wp365-hero-photo img {
    display: block;
    width: 100%;
    height: auto;
}

.wp365-trust-line {
    font-size: 0.95rem;
    color: var(--wp365-ink-soft);
    margin-top: 1.5rem;
}

/* ---------- Sections ---------- */

.wp365-section {
    padding-top: clamp(2.5rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.5rem, 6vw, 4.5rem);
}

.wp365-section--tint {
    background-color: var(--wp365-white);
    border-radius: var(--wp365-radius-lg);
}

.wp365-lead {
    font-size: 1.12rem;
    line-height: 1.7;
    color: var(--wp365-ink-soft);
    max-width: 640px;
}

.wp365-centre {
    text-align: center;
}

.wp365-centre .wp365-lead {
    margin-left: auto;
    margin-right: auto;
}

/* ---------- Pricing cards ---------- */

/* Word-breaking fix (v1.0.3): WordPress core sets
   `.wp-block-column { overflow-wrap: break-word; word-break:
   break-word }`, and the pricing cards are block columns inside a
   720px constrained section, so words were split mid-word on the
   live site ("Everythin g", "Honeymoo n"). Two changes: the cards
   never break a word, and the pricing section goes wide (1180px,
   see front-page.html) so each card has room to wrap normally.
   Copy and prices are unchanged. */
.wp365-price-card,
.wp365-price-card * {
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.wp365-price-card {
    background-color: var(--wp365-white);
    border: 1px solid var(--wp365-champagne-light);
    border-radius: var(--wp365-radius);
    padding: 2rem 1.6rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.wp365-price-card--popular {
    border: 2px solid var(--wp365-champagne);
    box-shadow: 0 18px 40px rgba(198, 161, 91, 0.18);
    position: relative;
}

.wp365-badge {
    display: inline-block;
    background-color: var(--wp365-champagne);
    color: var(--wp365-white);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-radius: 999px;
    padding: 0.35em 1em;
    margin-bottom: 0.75rem;
}

.wp365-price {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 2.6rem;
    line-height: 1;
    color: var(--wp365-ink);
    margin: 0.5rem 0 0.25rem;
}

.wp365-price-note {
    font-size: 0.92rem;
    color: var(--wp365-ink-soft);
}

.wp365-price-card ul {
    margin-top: 1.25rem;
}

.wp365-price-card .wp-block-buttons {
    margin-top: auto;
    padding-top: 1.5rem;
}

.wp365-save {
    color: var(--wp365-sage-deep);
    font-weight: 700;
}

/* ---------- Numbers / highlights ---------- */

.wp365-number {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 2.4rem;
    line-height: 1;
    color: var(--wp365-champagne-deep);
}

.wp365-number-label {
    font-size: 0.95rem;
    color: var(--wp365-ink-soft);
    line-height: 1.5;
}

.wp365-sheet-list {
    columns: 2;
    column-gap: 2rem;
}

.wp365-sheet-list li {
    break-inside: avoid;
    padding: 0.15rem 0;
}

/* ---------- FAQ (shortcode output shares one list with the
   FAQPage schema in functions.php, so visible FAQ and schema
   can never drift apart) ---------- */

.wp365-faq {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

.wp365-faq details {
    background-color: var(--wp365-white);
    border: 1px solid var(--wp365-champagne-light);
    border-radius: var(--wp365-radius);
    padding: 1rem 1.25rem;
    margin-bottom: 0.75rem;
}

.wp365-faq summary {
    cursor: pointer;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 1.1rem;
    line-height: 1.45;
    color: var(--wp365-ink);
}

.wp365-faq summary::marker {
    color: var(--wp365-champagne);
}

.wp365-faq details p {
    color: var(--wp365-ink-soft);
    line-height: 1.7;
    margin: 0.75rem 0 0.25rem;
}

/* ---------- Product page sections (added by hooks) ---------- */

.wp365-inside,
.wp365-tiers,
.wp365-delivery {
    max-width: 1180px;
    margin: 3rem auto;
    padding: 0 1.25rem;
}

.wp365-inside {
    background-color: var(--wp365-white);
    border: 1px solid var(--wp365-champagne-light);
    border-radius: var(--wp365-radius-lg);
    padding: 2rem clamp(1.25rem, 4vw, 2.5rem);
}

.wp365-inside h2,
.wp365-tiers h2,
.wp365-delivery h2 {
    margin-top: 0;
}

.wp365-tier-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 1.25rem;
}

.wp365-tier {
    border: 1px solid var(--wp365-champagne-light);
    border-radius: var(--wp365-radius);
    padding: 1.25rem;
    background-color: var(--wp365-white);
}

.wp365-tier--current {
    border: 2px solid var(--wp365-champagne);
}

.wp365-tier .wp365-price {
    font-size: 1.9rem;
}

.wp365-value-stack {
    background-color: var(--wp365-ivory-deep);
    border-radius: var(--wp365-radius);
    padding: 1rem 1.25rem;
    margin-top: 1rem;
    line-height: 1.6;
}

/* ---------- Footer (child theme, v1.0.3) ---------- */

/* Replaces the Twenty Twenty-Five default footer links (Blog,
   About, FAQs, Authors, Events, Shop, Patterns, Themes — all
   dead "#" links). The footer itself lives in parts/footer.html;
   this only draws the divider and the small print. */
.wp365-footer {
    border-top: 1px solid var(--wp365-champagne-light);
}

.wp365-footer .wp-block-site-title {
    font-size: 1.4rem;
}

.wp365-footer .wp-block-site-title a {
    text-decoration: none;
}

.wp365-footer-copy {
    font-size: 0.9rem;
    color: var(--wp365-ink-soft);
}

.wp365-closing {
    background: linear-gradient(160deg, var(--wp365-sage) 0%, var(--wp365-sage-deep) 100%);
    color: var(--wp365-white);
    border-radius: var(--wp365-radius-lg);
    padding: clamp(2.5rem, 6vw, 4rem) clamp(1.5rem, 5vw, 3rem);
    text-align: center;
}

.wp365-closing h2,
.wp365-closing p {
    color: var(--wp365-white);
}

.wp365-closing .wp-block-button__link {
    background-color: var(--wp365-white);
    color: var(--wp365-ink);
}

.wp365-closing .wp-block-button__link:hover,
.wp365-closing .wp-block-button__link:focus-visible {
    background-color: var(--wp365-blush);
    color: var(--wp365-ink);
}

/* ---------- Small screens first: keep everything readable ---------- */

@media (max-width: 640px) {
    .wp365-sheet-list {
        columns: 1;
    }

    .wp365-tier-grid {
        grid-template-columns: 1fr;
    }

    .wp365-hero::before {
        width: 220px;
        height: 220px;
        top: -120px;
    }

    .wp365-hero::after {
        width: 170px;
        height: 170px;
        bottom: -90px;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs {
        overflow-x: auto;
    }
}
