/* ─── Service + Offer Schema Block (.hzo-service-schema) ─────────────────
   The visible price-framing card for W-003 (service-schema.php). Structured
   content, not a composite widget: a heading, a measure-capped description,
   a price framing line, an optional priced offer list (native <details> when
   collapsed past offers-max), and an optional CTA. The Service JSON-LD is
   PHP-emitted and has no styling surface.

   Tokens only — no bare hex/px/ms, no z-index (this block never portals or
   stacks). schema-only render emits no DOM, so none of this applies there. */
.hzo-service-schema {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    max-width: var(--prose-max-width);
    padding: var(--space-lg);
    background: var(--card-bg, var(--surface));
    border: 1px solid var(--card-border, var(--border));
    border-radius: var(--radius-panel);
    box-shadow: var(--card-shadow);
}

.hzo-service-schema__heading {
    margin: 0;
    color: var(--text-heading);
}

.hzo-service-schema__desc {
    margin: 0;
    max-width: var(--prose-max-width);
    color: var(--text-body);
}

/* ── Price framing ── */
.hzo-service-schema__price {
    margin: 0;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: var(--space-sm);
}
.hzo-service-schema__price-value {
    color: var(--brand-text);
    font-family: var(--font-number, inherit);
    font-weight: var(--fw-bold, 700);
    /* Size inherits from the type-scale ladder (base.css); emphasis is carried
       by the number font + weight + brand color, not a hardcoded font-size. */
}
.hzo-service-schema__price-unit {
    color: var(--text-muted);
    font-weight: var(--fw-medium, 500);
}

/* ── Offer list + native <details> disclosure ── */
.hzo-service-schema__offers {
    margin: 0;
}
.hzo-service-schema__offers-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}
.hzo-service-schema__offer {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-md);
    padding-block: var(--space-2xs);
    border-bottom: 1px solid var(--card-border, var(--border));
    color: var(--text-body);
}
.hzo-service-schema__offer:last-child {
    border-bottom: 0;
}
.hzo-service-schema__offer-link {
    color: var(--brand-text);
    text-decoration: none;
}
.hzo-service-schema__offer-link:hover {
    text-decoration: underline;
}
.hzo-service-schema__offer-price {
    color: var(--text-heading);
    font-family: var(--font-number, inherit);
    font-weight: var(--fw-semibold, 600);
    white-space: nowrap;
    flex-shrink: 0;
}

/* <summary> toggle — native disclosure; ≥24px hit area, real focus ring.
   No box-shadow ring (forced-colors-safe): relies on outline (§12.2). */
.hzo-service-schema__offers-toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    min-height: 24px;
    padding-block: var(--space-2xs);
    color: var(--brand-text);
    font-weight: var(--fw-semibold, 600);
    cursor: pointer;
    list-style: none;              /* hide default marker; use our own caret */
}
.hzo-service-schema__offers-toggle::-webkit-details-marker {
    display: none;
}
.hzo-service-schema__offers-toggle::after {
    content: "";
    width: 0.5em;
    height: 0.5em;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform var(--dur-1) var(--ease-standard);
}
.hzo-service-schema__offers[open] > .hzo-service-schema__offers-toggle::after {
    transform: rotate(-135deg);
}
.hzo-service-schema__offers[open] > .hzo-service-schema__offers-toggle {
    margin-bottom: var(--space-sm);
}

/* ── CTA (native <a>; inherits .hzo-btn) ── */
.hzo-service-schema__cta {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    min-height: 24px;              /* .hzo-btn already exceeds this; explicit floor */
}
.hzo-service-schema__cta-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* ── Print: customers print estimates — the card, price, and FULL offer list
   must print. Force any collapsed <details> open, and force-reveal an opt-in
   .hzo-reveal card so it is never blank (G13). Drop the decorative caret. ── */
@media print {
    .hzo-service-schema {
        box-shadow: none;
        border-color: currentColor;
    }
    .hzo-service-schema.hzo-reveal {
        opacity: 1 !important;
        transform: none !important;
    }
    .hzo-service-schema__offers[open] > .hzo-service-schema__offers-toggle::after,
    .hzo-service-schema__offers-toggle::after {
        display: none;
    }
    .hzo-service-schema__offers-list {
        display: flex !important;   /* browsers auto-open <details> for print, but be explicit */
    }
}

/* ── Forced-colors: convey no state through color/shadow alone; keep a border. ── */
@media (forced-colors: active) {
    .hzo-service-schema {
        border: 1px solid CanvasText;
    }
    .hzo-service-schema__offers-toggle::after {
        border-color: CanvasText;
    }
}

/* ── Reduced-motion: kill the only animated affordance (the caret rotate).
   PRESERVE-5 — ambient motion stops; content stays visible. ── */
@media (prefers-reduced-motion: reduce) {
    .hzo-service-schema__offers-toggle::after {
        transition: none;
    }
}