/*
 * Marketing interaction vocabulary.
 * Navigation signals a destination; disclosures reveal teaching in place.
 * Essential content and actions never depend on hover. No runtime required.
 * Movement is opt-in via reduced-motion preference and fine-pointer hover.
 */

/* Four value layers: a small diagram, a clear invitation, a real example. */
.v-value-explorer { --value-ink: #243b2d; --value-line: #86754e; margin-top: 44px; }
.v-home-method .v-value-instruction { max-width: 760px; font-size: 16px; line-height: 1.6; margin-bottom: 22px; }
.v-value-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; align-items: start; }
.v-value-card { min-width: 0; border: 1px solid #86754e70; border-radius: var(--radius-surface); background: #f6efdf55; color: var(--value-ink); }
.v-value-card > summary { list-style: none; padding: 22px 20px 14px; border-radius: inherit; }
.v-value-card > summary::-webkit-details-marker { display: none; }
.v-value-card > summary:focus-visible { outline: 3px solid #294f3b; outline-offset: 4px; }
.v-value-top { display: flex; justify-content: space-between; align-items: start; gap: 12px; margin-bottom: 18px; }
.v-value-diagram { flex: none; width: 100px; height: 75px; overflow: visible; }
.v-value-index { padding-top: 7px; color: #645735; font: 650 11px/1.4 var(--reading); letter-spacing: .08em; white-space: nowrap; }
.v-value-plane { fill: #e0d2b3; stroke: #86754e; stroke-width: 1.2; }
.v-value-plane--active { fill: #315540; stroke: #243b2d; }
.v-value-trace { stroke: #315540; stroke-width: 2; }
.v-value-card h3 { margin-bottom: 12px; font-size: 29px; line-height: 1.12; }
.v-home-method .v-value-description { min-height: 4.8em; font-size: 16px; line-height: 1.6; }
.v-value-action { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 44px; border-top: 1px solid #86754e60; margin-top: 20px; font: 650 14px/1.35 var(--reading); }
.v-value-plus { display: grid; place-items: center; flex: none; width: 26px; height: 26px; border: 1px solid #86754e80; border-radius: 4px; font: 22px/1 var(--reading); }
.v-value-hide { display: none; }
.v-value-card[open] { background: #f4eddd; border-color: #315540; box-shadow: 0 4px 0 #315540; }
.v-value-card[open] .v-value-show { display: none; }
.v-value-card[open] .v-value-hide { display: inline; }
.v-value-card[open] .v-value-plus { transform: rotate(45deg); background: #315540; border-color: #315540; color: #fff5df; }
.v-value-card[open] .v-value-plane--active { fill: #8b6830; }
.v-value-example { margin: 0 20px; padding: 20px 0 24px; border-top: 1px solid #86754e60; }
.v-home-method .v-value-example p { font-size: 16px; line-height: 1.6; }
.v-home-method .v-value-example .v-value-label { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; color: #645124; margin: 22px 0 8px; }
.v-home-method .v-value-example .v-value-label:first-child { margin-top: 0; }
.v-value-example blockquote { color: #243b2d; font-size: 20px; line-height: 1.4; }
.v-value-example .v-value-question { font-weight: 600; }
.v-home-method .v-value-note { margin-top: 22px; max-width: 760px; font-size: 14px; line-height: 1.6; color: #514d39; }

/* Arrows move independently: text and click targets stay put. */
:is(.v-button,.v-text-link,.v-nav-action,.v-selection-link) > span[aria-hidden="true"],
:is(.v-reading-card-link,.v-home-media-watch,.v-book-connections strong) > span[aria-hidden="true"] { display: inline-block; flex: none; }

/* Destination cards get the same restrained depth and visible edge. */
:is(.v-home-course,.v-home-appearance,.v-home-teaching) { border-radius: var(--radius-surface); }
.v-home-course > .v-course-art,
.v-home-appearance-image { border-radius: var(--radius-surface) var(--radius-surface) 0 0; overflow: hidden; }
.v-home-teaching-image { overflow: hidden; }
.v-home-media-play { border-radius: 4px; }
.v-home-course:focus-visible { border-color: var(--gold); box-shadow: 0 8px 24px #0003; }
.v-home-appearance:focus-visible { color: #18372b; border-color: #e1c17b; box-shadow: 0 8px 24px #0003; }
.v-home-teaching:focus-visible { color: #fff2cf; border-color: #a58035; }
.v-book-connections a:focus-visible strong { text-decoration: underline; text-underline-offset: 4px; }
.v-book-folio { border-radius: var(--radius-control); text-decoration: none; }
.v-book-folio-open { display: flex; justify-content: space-between; gap: 24px; align-items: center; width: 100%; margin-top: 28px; padding-top: 16px; border-top: 1px solid #d9b66665; color: #e4c67f; font: 650 15px/1.4 var(--reading); }
.v-book-folio:focus-visible { color: #f4ead5; outline: 3px solid #705729; outline-offset: 7px; }
.v-book-folio:focus-visible .v-book-folio-open { text-decoration: underline; text-underline-offset: 4px; }
.v-reading-card:focus-visible h2 { color: #725923; }
.v-reading-card--featured:focus-visible h2 { color: var(--action-hover); }
.v-framework-layer-step:focus-visible { background: #ffffff06; }
.v-framework-layer-step:focus-visible h2 { color: var(--action-hover); }
.v-value-card:has(> summary:focus-visible) { background: #f4eddd; border-color: #315540; }

/* Navigation and disclosure affordances also work without a mouse. */
.v-nav a:not(.v-nav-action), .v-footer nav a { text-decoration-line: underline; text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: 7px; }
.v-nav a[aria-current="page"], .v-nav a:focus-visible, .v-footer nav a:focus-visible { text-decoration-color: currentColor; }
.v-course-questions summary:focus-visible { color: var(--action-hover); }
.ck-chooser > a:focus-visible, .ck-topic-grid > a:focus-visible { border-color: var(--gold); }
.v-selection-row:has(a:focus-visible),
.v-toolkit-product-row:has(a:focus-visible) { border-bottom-color: #705729; background: #70572908; }
.v-selection-directory a:focus-visible, .v-library-listing a:focus-visible { outline-color: #705729; }
.v-info-about .featured-grid .featured-item:focus-visible { border-color: #80652e; background: #eeece3; }
.v-industry-curriculum summary:focus-visible { background: #ffffff06; }
.v-industry-movements summary:focus-visible { outline-color: #705729; }
.v-home-example-detail > summary:focus-visible { text-decoration: underline; text-underline-offset: 5px; }

/* Tactile surfaces: small highlights give controls depth without another asset. */
.v-button:not(.v-button-secondary) {
  background-image: linear-gradient(120deg,#fff4d52b,transparent 65%);
  box-shadow: inset 0 1px 0 #fff3ce70,0 3px 0 #4f412c;
}
.v-button:not(.v-button-secondary):active { box-shadow: inset 0 2px 3px #40351c40; }
.v-home-course-detail { border-radius: 0 0 var(--radius-surface) var(--radius-surface); background-image: linear-gradient(135deg,#d9b6660c,transparent 60%); }
.v-home-course-detail > div > span > span[aria-hidden="true"] { display: inline-block; }
.ck-chooser > a,.ck-topic-grid > a { background-image: linear-gradient(135deg,#d9b6660c,transparent 65%); }

/* A tiny practice round using the exact authored course conversation. */
.v-home-recognize .v-two { align-items: start; }
.v-home-dialogue { padding-top: 20px; }
.v-home-decisions { margin: 28px 0 24px; }
.v-home-decision-hint { margin: 8px 0 18px; color: #c4cabd; font-size: 15px; line-height: 1.6; }
.v-home-decision { border: 1px solid #7f8e7466; border-radius: var(--radius-surface); background: linear-gradient(125deg,#2c3d2e,#19231b); }
.v-home-decision + .v-home-decision { margin-top: 12px; }
.v-home-decision > summary { display: flex; align-items: start; gap: 14px; padding: 20px; list-style: none; cursor: pointer; border-radius: inherit; }
.v-home-decision > summary::-webkit-details-marker { display: none; }
.v-home-decision-mark { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border: 1px solid #b39b64; border-radius: 7px; color: #eed39b; font: 600 14px/1 var(--reading); box-shadow: inset 0 1px 0 #fff2; }
.v-home-decision-question { display: block; min-width: 0; flex: 1; }
.v-home-decision .v-home-reply { display: block; margin: 0; font-size: 18px; line-height: 1.5; color: #f1eee2; }
.v-home-decision-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; color: #e4c786; font-size: 13px; font-weight: 650; }
.v-home-decision-action > span[aria-hidden="true"] { display: inline-block; font: 22px/1 var(--reading); }
.v-home-decision-hide { display: none; }
.v-home-decision[open] { border-color: #d9b666; }
.v-home-decision[open] .v-home-decision-mark { color: #222c22; background: #d9b666; border-color: #ecd49e; }
.v-home-decision[open] .v-home-decision-show { display: none; }
.v-home-decision[open] .v-home-decision-hide { display: inline; }
.v-home-decision[open] .v-home-decision-action > span[aria-hidden="true"] { transform: rotate(45deg); }
.v-home-decision-response { padding: 22px; border-top: 1px solid #b6a778; border-radius: 0 0 var(--radius-surface) var(--radius-surface); background: #eee6d4; color: #273b2c; }
.v-home-decision-response .v-speaker { color: #68532c; font-size: 10px; }
.v-home-decision-response blockquote { color: #273b2c; font-size: 20px; line-height: 1.5; margin: 12px 0 22px; }
.v-home-decision-response > p:not(.v-speaker) { font-size: 16px; line-height: 1.65; color: #3e4c3d; }
.v-home-decision-response .v-home-decision-evidence { padding-top: 18px; border-top: 1px solid #b8b097; margin-bottom: 8px; font-weight: 700; color: #263d2c; }
.v-home-decision:has(> summary:focus-visible) { border-color: #e5c887; }

/* Alternative starting points, not a compulsory ladder of purchases. */
.v-home-next-paths { display: grid; gap: 12px; margin: 26px 0 28px; }
.v-home-next-path { display: flex; align-items: start; gap: 18px; padding: 21px; border: 1px solid #6c765c; border-radius: var(--radius-surface); background: linear-gradient(120deg,#30442c,#1c2b21); color: #f0ecde; text-decoration: none; }
.v-home-next-icon { flex: none; width: 34px; height: 36px; color: #e4c786; margin-top: 4px; }
.v-home-next-copy { flex: 1; min-width: 0; display: grid; gap: 5px; }
.v-home-next-copy strong { font-size: 20px; font-weight: 650; color: #f0ecde; line-height: 1.4; }
.v-home-next-copy > span:last-child { color: #cdd4c4; font-size: 16px; line-height: 1.5; }
.v-home-next-note { color: #e4c786; font-size: 10px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.v-home-next-path > span[aria-hidden="true"] { color: #e4c786; font-size: 24px; line-height: 1; flex: none; padding-top: 7px; }
.v-home-next-path:focus-visible { border-color: #e4c786; outline-color: #e4c786; }

@media (hover: hover) and (pointer: fine) {
  .v-home-decision:has(> summary:hover),.v-home-next-path:hover { border-color: #e4c786; }
  .v-value-card:has(> summary:hover) { background: #f4eddd; border-color: #315540; }
  .v-value-card > summary:hover .v-value-plus { background: #315540; color: #fff5df; border-color: #315540; }
  .v-home-course:hover { box-shadow: 0 8px 24px #0003; }
  .v-framework-layer-step:hover { background: #ffffff06; }
  .v-reading-card:hover .v-reading-card-link { text-decoration: underline; text-underline-offset: 5px; }
  .v-book-connections a:hover { background: #ffffff28; }
  .v-book-folio:hover { color: #f4ead5; box-shadow: 12px 14px 0 #bfb69c,0 24px 40px #263b3030; }
  .v-book-folio:hover .v-book-folio-open { text-decoration: underline; text-underline-offset: 4px; }
  .v-selection-row:has(a:hover), .v-toolkit-product-row:has(a:hover) { border-bottom-color: #705729; background: #70572908; }
  .v-industry-curriculum summary:hover { background: #ffffff06; }
  .v-industry-movements summary:hover, .v-home-example-detail > summary:hover { text-decoration: underline; text-underline-offset: 5px; }
  .v-nav a:hover, .v-footer nav a:hover { text-decoration-color: currentColor; }
  .v-course-questions summary:hover { color: var(--action-hover); }
  .ck-chooser > a:hover, .ck-topic-grid > a:hover { border-color: var(--gold); }
}

@media (prefers-reduced-motion: no-preference) {
  @keyframes vivid-response-enter { from { opacity: .5; transform: translateY(5px); } to { opacity: 1; transform: none; } }
  .v-home-decision-action > span[aria-hidden="true"],.v-home-next-path > span[aria-hidden="true"],.v-home-course-detail > div > span > span[aria-hidden="true"] { transition: transform 200ms ease; }
  .v-home-next-path,.v-home-decision { transition: border-color 180ms ease; }
  .v-home-decision[open] .v-home-decision-response { animation: vivid-response-enter 220ms ease-out; }
  .v-home-next-path:focus-visible > span[aria-hidden="true"] { transform: translate(3px,-3px); }
  .v-value-card { transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
  .v-value-plane--active, .v-value-trace { transition: transform 220ms ease, fill 180ms ease; }
  .v-value-plus { transition: transform 180ms ease, background-color 180ms ease; }
  :is(.v-button,.v-text-link,.v-nav-action,.v-selection-link) > span[aria-hidden="true"],
  :is(.v-reading-card-link,.v-home-media-watch,.v-book-connections strong) > span[aria-hidden="true"],
  .v-framework-layer-step .explore,
  .v-home-media-play { transition: transform 180ms ease; }
  .v-home-course .v-course-art-sheet { transition: transform 220ms ease; }
  .v-home-teaching-image img { transition: transform 240ms ease; }
  :is(.v-home-course,.v-home-appearance,.v-home-teaching) { transition: border-color 180ms ease, box-shadow 180ms ease; }
  .v-book-folio { transition: box-shadow 200ms ease; }
  :is(.v-button,.v-text-link,.v-nav-action,.v-selection-link):focus-visible > span[aria-hidden="true"] { transform: translateX(3px); }
  .v-value-card > summary:focus-visible .v-value-plane--active,
  .v-value-card > summary:focus-visible .v-value-trace { transform: translateX(4px); }
  @media (hover: hover) and (pointer: fine) {
    .v-home-next-path:hover > span[aria-hidden="true"],.v-home-course:hover .v-home-course-detail > div > span > span[aria-hidden="true"] { transform: translate(3px,-3px); }
    .v-value-card > summary:hover .v-value-plane--active,
    .v-value-card > summary:hover .v-value-trace { transform: translateX(4px); }
    :is(.v-button,.v-text-link,.v-nav-action,.v-selection-link):hover > span[aria-hidden="true"],
    .v-reading-card:hover .v-reading-card-link > span[aria-hidden="true"],
    .v-home-appearance:hover .v-home-media-watch > span[aria-hidden="true"],
    .v-book-connections a:hover strong > span[aria-hidden="true"],
    .v-framework-layer-step:hover .explore { transform: translateX(3px); }
    .v-home-course:hover .v-course-art-sheet { transform: rotate(-1deg); }
    .v-home-appearance:hover .v-home-media-play { transform: translate(2px,-2px); }
    .v-home-teaching:hover .v-home-teaching-image img { transform: scale(1.015); }
  }
}
/* Keep touch feedback immediate; suppress an older About-card hover lift. */
@media (hover: none), (prefers-reduced-motion: reduce) {
  .v-info-about .featured-grid .featured-item:has(.featured-thumb):hover { transform: none; transition: none; }
}

@media (max-width: 1050px) {
  .v-value-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .v-value-card h3 { min-height: 0; }
  .v-home-method .v-value-description { min-height: 3.2em; }
}
@media (max-width: 540px) {
  .v-home-decision > summary { padding: 17px 14px; gap: 10px; }
  .v-home-decision .v-home-reply { font-size: 17px; }
  .v-home-decision-response { padding: 20px 18px; }
  .v-home-next-path { padding: 18px 16px; gap: 12px; }
  .v-home-next-icon { width: 28px; height: 30px; }
  .v-value-explorer { margin-top: 28px; }
  .v-value-grid { grid-template-columns: 1fr; gap: 14px; }
  .v-value-card > summary { padding: 18px 20px 12px; }
  .v-value-top { margin-bottom: 10px; }
  .v-value-diagram { width: 78px; height: 59px; }
  .v-value-card h3 { font-size: 28px; }
  .v-home-method .v-value-description { min-height: 0; }
  .v-value-action { margin-top: 16px; }
}
@media (forced-colors: active) {
  .v-home-decision[open],.v-home-next-path:focus-visible { outline: 2px solid Highlight; }
  .v-value-plane { fill: Canvas; stroke: CanvasText; }
  .v-value-plane--active { fill: Highlight; stroke: Highlight; }
  .v-value-trace { stroke: CanvasText; }
  .v-value-card[open], .v-value-card > summary:focus-visible { outline: 2px solid Highlight; }
}
