/* ============================================================
   ROAM Solutions — v2 repositioning styles
   Service lines, front door, boundaries, book teaser, book page.
   Loaded after styles.css. Added July 2026.
   ============================================================ */

/* ---------- Services: the front door ---------- */
.services { background: var(--paper); }
.frontdoor {
    position: relative;
    display: flex; align-items: center; gap: 32px;
    background: linear-gradient(150deg, var(--ink-2) 0%, var(--ink-3) 100%);
    border: 1px solid rgba(234,241,246,.10);
    border-left: 4px solid var(--copper);
    border-radius: var(--radius);
    padding: 34px 36px;
    margin-bottom: 44px;
    box-shadow: var(--shadow);
}
.frontdoor-tag {
    position: absolute; top: -12px; left: 32px;
    background: var(--copper); color: #fff;
    font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
    padding: 5px 14px; border-radius: 20px; box-shadow: 0 6px 16px rgba(180,112,58,.32);
}
.frontdoor-body { flex: 1; }
.frontdoor-body h3 { font-family: var(--serif); font-weight: 600; font-size: 1.5rem; color: #fff; margin-bottom: 10px; }
.frontdoor-body p { color: var(--text-inv-mut); font-size: .98rem; line-height: 1.7; max-width: 68ch; }
.frontdoor .btn { flex-shrink: 0; }

/* ---------- Services: the four lines ---------- */
.lines-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.line-card {
    position: relative;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 30px 26px 26px;
    transition: transform .2s ease, box-shadow .25s ease, border-color .25s ease;
}
.line-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.line-icon { display: block; color: var(--copper); margin-bottom: 12px; }
.line-icon svg { width: 30px; height: 30px; }
.line-index {
    font-family: var(--serif); font-weight: 600; font-size: 1.1rem;
    color: var(--copper); opacity: .55; letter-spacing: .04em;
}
.line-card h3 { font-family: var(--serif); font-weight: 600; font-size: 1.35rem; color: var(--text-strong); margin: 6px 0 8px; }
.line-promise { color: var(--text-muted); font-size: .92rem; line-height: 1.5; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }
.line-card ul { list-style: none; display: flex; flex-direction: column; gap: 15px; }
.line-card li { line-height: 1.4; }
.line-card li span { display: block; font-weight: 600; font-size: .92rem; color: var(--text-strong); }
.line-card li small { display: block; font-size: .82rem; color: var(--text-muted); margin-top: 3px; line-height: 1.45; }
.line-review-intro { font-size: .84rem; color: var(--text-muted); line-height: 1.5; margin: 0 0 16px; }
.line-review-intro strong { color: var(--copper); font-weight: 600; }
.line-fields { list-style: none; margin-top: 12px; display: grid; gap: 7px; }
.line-fields li { font-size: .82rem; font-weight: 500; color: var(--text-muted); line-height: 1.4; padding-left: 15px; position: relative; }
.line-fields li::before { content: "—"; position: absolute; left: 0; color: var(--copper); }
.line-link { font-size: .85rem; font-weight: 600; color: var(--copper); text-decoration: none; }
.line-link:hover { color: var(--copper-light); }

/* ---------- How ROAM works: boundaries ---------- */
.how { background: var(--ink-2); color: var(--text-inv); }
.how .section-title { color: #fff; margin-bottom: 20px; }
.how-lead { max-width: 68ch; margin: 0 auto 52px; text-align: center; color: var(--text-inv-mut); font-size: 1.06rem; line-height: 1.75; }
.bound-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.bound {
    background: rgba(234,241,246,.03);
    border: 1px solid rgba(234,241,246,.10);
    border-top: 3px solid var(--copper);
    border-radius: var(--radius);
    padding: 26px 24px;
}
.bound h4 { font-family: var(--serif); font-weight: 600; font-size: 1.1rem; color: var(--copper-light); margin-bottom: 12px; }
.bound p { color: var(--text-inv-mut); font-size: .92rem; line-height: 1.65; }

/* ---------- Book teaser (homepage) ---------- */
.bookteaser { background: var(--paper-3); border-top: 1px solid var(--line); }
.bookteaser-inner { display: grid; grid-template-columns: auto 1fr; gap: 56px; align-items: center; max-width: 940px; }
.bookteaser-cover { display: block; text-decoration: none; }
.bookcover-mini {
    display: flex; flex-direction: column; justify-content: space-between;
    width: 210px; height: 300px; padding: 26px 22px;
    background: linear-gradient(155deg, var(--ink-2) 0%, var(--ink-3) 100%);
    border-radius: 4px 10px 10px 4px;
    border-left: 5px solid var(--copper);
    box-shadow: var(--shadow-lg);
    transition: transform .25s ease;
}
.bookteaser-cover:hover .bookcover-mini { transform: translateY(-4px) rotate(-1deg); }
.bmc-kicker { font-size: .64rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--copper-light); }
.bmc-title { font-family: var(--serif); font-weight: 600; font-size: 2rem; line-height: 1.08; color: #fff; letter-spacing: -.01em; }
.bmc-author { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-inv-mut); }
.bookteaser-img { width: 210px; max-width: 100%; height: auto; display: block; border-radius: 4px 10px 10px 4px; box-shadow: var(--shadow-lg); transition: transform .25s ease; }
.bookteaser-cover:hover .bookteaser-img { transform: translateY(-4px) rotate(-1deg); }
.bookcover-img { width: 300px; max-width: 100%; height: auto; display: block; border-radius: 4px 10px 10px 4px; box-shadow: var(--shadow-lg); }
.bookteaser-copy .section-title { text-align: left; margin-bottom: 18px; }
.bookteaser-copy p { color: var(--text-muted); font-size: 1.04rem; line-height: 1.75; margin-bottom: 26px; max-width: 52ch; }

/* ---------- Book page ---------- */
.bookpage-hero {
    background:
        radial-gradient(900px 460px at 82% -10%, rgba(180,112,58,.18), transparent 60%),
        linear-gradient(160deg, var(--ink) 0%, var(--ink-3) 100%);
    color: var(--text-inv);
}
.bookpage-hero .section-inner { display: grid; grid-template-columns: 300px 1fr; gap: 64px; align-items: center; }
.bookcover-lg {
    display: flex; flex-direction: column; justify-content: space-between;
    width: 300px; height: 428px; padding: 38px 32px;
    background: linear-gradient(155deg, var(--ink-2) 0%, var(--ink-3) 100%);
    border-radius: 4px 12px 12px 4px;
    border-left: 7px solid var(--copper);
    box-shadow: var(--shadow-lg);
}
.bookcover-lg .bmc-title { font-size: 2.9rem; }
.bookcover-lg .bmc-sub { font-family: var(--serif); font-style: italic; font-size: 1rem; color: var(--copper-light); margin-top: 12px; }
.book-status {
    display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
    color: var(--copper-light); border: 1px solid rgba(180,112,58,.4); border-radius: 20px; padding: 5px 15px; margin-bottom: 22px;
}
.book-hero-title { font-family: var(--serif); font-weight: 600; font-size: clamp(2.4rem, 5vw, 3.6rem); line-height: 1.05; color: #fff; letter-spacing: -.02em; margin-bottom: 16px; }
.book-hero-sub { font-family: var(--serif); font-style: italic; font-size: clamp(1.1rem, 2vw, 1.4rem); color: var(--copper-light); margin-bottom: 26px; }
.book-hero-lead { color: var(--text-inv-mut); font-size: 1.08rem; line-height: 1.75; max-width: 56ch; margin-bottom: 32px; }
.buy-store { margin: 0 0 14px; max-width: 520px; }
.buy-store label { display: block; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; color: var(--text-inv-mut); margin-bottom: 7px; }
.buy-store select { width: 100%; max-width: 340px; padding: 11px 13px; border-radius: 9px; background: rgba(234,241,246,.07); color: #EAF1F6; border: 1.5px solid rgba(234,241,246,.22); font: inherit; cursor: pointer; }
.buy-store select:focus-visible { outline: 2px solid var(--copper-light); outline-offset: 2px; }
.buy-note { margin: 12px 0 0; font-size: .85rem; line-height: 1.55; color: var(--text-inv-mut); max-width: 520px; }
/* Praise / endorsements */
.praise-sec { background: var(--paper); }
.praise-h { font-family: var(--serif); font-weight: 600; font-size: 1.7rem; color: var(--text-strong); margin: 4px 0 28px; }
.praise-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 22px; }
.praise-card { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px; box-shadow: 0 6px 24px rgba(20,24,38,.05); }
.praise-card blockquote { margin: 0 0 16px; font-family: var(--serif); font-size: 1.05rem; line-height: 1.55; color: var(--text-strong); }
.praise-card figcaption { display: flex; flex-direction: column; gap: 2px; border-top: 1px solid var(--line); padding-top: 12px; }
.praise-name { font-weight: 700; font-size: .9rem; color: var(--text-strong); }
.praise-title { font-size: .82rem; color: var(--text-muted); }
.endorse-cta { margin: 16px 0 0; font-size: .9rem; color: var(--text-muted); }
.endorse-cta a { color: var(--copper); font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; }

/* About — stewardship pull-quote (from Designed to Hold, ch.13–14) */
.about-steward {
    margin: 26px 0 0;
    padding: 4px 0 4px 22px;
    border-left: 3px solid var(--copper);
    font-family: var(--serif);
    font-size: 1.18rem;
    line-height: 1.5;
    font-style: italic;
    color: var(--text-strong);
}

/* ---------- Texture + warmth on the flat dark sections ---------- */
.problem, .how, .workshop, .contact { position: relative; }
.problem > .section-inner, .how > .section-inner, .workshop > .section-inner, .contact > .section-inner { position: relative; z-index: 1; }
.problem::before, .how::before, .workshop::before, .contact::before {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
        radial-gradient(720px 400px at 86% -15%, rgba(180,112,58,.13), transparent 62%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49'%3E%3Cpath fill='%23b4703a' fill-opacity='0.06' fill-rule='evenodd' d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/svg%3E");
    background-size: auto, 30px 52px;
}
/* Selected Experience (light background) — subtle warm honeycomb + copper glow */
.experience { position: relative; }
.experience > .section-inner { position: relative; z-index: 1; }
.experience::before {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
        radial-gradient(620px 360px at 92% -12%, rgba(180,112,58,.10), transparent 62%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49'%3E%3Cpath fill='%23b4703a' fill-opacity='0.05' fill-rule='evenodd' d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/svg%3E");
    background-size: auto, 30px 52px;
}
.book-actions { display: flex; flex-wrap: wrap; gap: 14px; min-height: 46px; }

/* order links / placeholders */
.btn-soon { background: rgba(234,241,246,.08); color: var(--text-inv-mut); border-color: rgba(234,241,246,.18); cursor: not-allowed; position: relative; }
.btn-soon:hover { transform: none; }
.btn-soon::after { content: "Soon"; margin-left: 8px; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--copper-light); }
.btn-soon.btn-later::after { content: "Later"; }

.book-body { background: var(--paper); }
.book-cols { display: grid; grid-template-columns: 1.5fr 1fr; gap: 56px; align-items: start; }
.book-copy h2 { font-family: var(--serif); font-weight: 600; font-size: 1.6rem; color: var(--text-strong); margin: 0 0 18px; }
.book-copy h3 { font-family: var(--serif); font-weight: 600; font-size: 1.15rem; color: var(--text-strong); margin: 30px 0 12px; }
.book-copy p { color: var(--text-muted); font-size: 1.02rem; line-height: 1.78; margin-bottom: 16px; }
.book-copy ul { list-style: none; display: flex; flex-direction: column; gap: 12px; margin: 8px 0; }
.book-copy ul li { position: relative; padding-left: 24px; color: var(--text-muted); font-size: 1rem; line-height: 1.6; }
.book-copy ul li::before { content: ""; position: absolute; left: 0; top: .6em; width: 7px; height: 7px; border-radius: 2px; background: var(--copper); transform: rotate(45deg); }

/* details / specs card with placeholders */
.book-specs { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px 26px; position: sticky; top: 90px; }
.book-specs h3 { font-family: var(--serif); font-weight: 600; font-size: 1.12rem; color: var(--text-strong); margin-bottom: 18px; }
.spec-row { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: .9rem; }
.spec-row:last-of-type { border-bottom: none; }
.spec-row dt { color: var(--text-muted); }
.spec-row dd { color: var(--text-strong); font-weight: 600; text-align: right; margin: 0; }
.spec-ph { color: var(--copper); font-weight: 600; font-family: var(--sans); font-size: .82rem; }
.barcode-ph {
    margin-top: 20px; height: 72px; border-radius: 6px;
    background: repeating-linear-gradient(90deg, var(--text-strong) 0 2px, transparent 2px 4px, var(--text-strong) 4px 5px, transparent 5px 9px);
    opacity: .18;
}
.barcode-cap { font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); text-align: center; margin-top: 8px; }

/* future books */
.more-books { background: var(--paper-2); border-top: 1px solid var(--line); }
.more-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.more-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 24px; }
.more-card.is-placeholder { border-style: dashed; display: grid; place-items: center; text-align: center; min-height: 150px; color: var(--text-muted); }
.more-card h3 { font-family: var(--serif); font-weight: 600; font-size: 1.15rem; color: var(--text-strong); margin-bottom: 8px; }
.more-card .exp-meta { display: block; margin-bottom: 10px; }
.more-card p { font-size: .92rem; color: var(--text-muted); line-height: 1.6; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .lines-grid { grid-template-columns: repeat(2, 1fr); }
    .bound-grid { grid-template-columns: repeat(2, 1fr); }
    .frontdoor { flex-direction: column; align-items: flex-start; gap: 20px; }
    .bookteaser-inner { grid-template-columns: 1fr; gap: 32px; justify-items: center; text-align: center; }
    .bookteaser-copy .section-title { text-align: center; }
    .bookpage-hero .section-inner { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 36px; }
    .book-hero-lead { margin-left: auto; margin-right: auto; }
    .book-actions { justify-content: center; }
    .book-cols { grid-template-columns: 1fr; gap: 36px; }
    .book-specs { position: static; }
    .more-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .lines-grid, .bound-grid { grid-template-columns: 1fr; }
}

/* ---- Workshop outputs showcase ---- */
.ws-outputs { margin-top: 44px; }
.ws-outputs-h { text-align: center; margin-bottom: 22px; }
.ws-outputs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.out-col { background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--copper); border-radius: var(--radius); padding: 24px 26px; }
.out-col-h { font-family: var(--serif); font-weight: 600; font-size: 1.12rem; color: var(--text-strong); margin-bottom: 15px; }
.out-list { list-style: none; margin: 0; padding: 0; }
.out-list li { position: relative; padding: 0 0 12px 26px; margin-bottom: 12px; border-bottom: 1px solid var(--line); font-size: .93rem; line-height: 1.5; color: var(--text-muted); }
.out-list li:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.out-list li::before { content: ""; position: absolute; left: 0; top: .45em; width: 8px; height: 8px; border-radius: 2px; background: var(--copper); transform: rotate(45deg); }
.out-list li b { color: var(--text-strong); font-weight: 600; }
@media (max-width: 760px) { .ws-outputs-grid { grid-template-columns: 1fr; } }

/* ---- Workshop outputs subline ---- */
.ws-outputs-sub { text-align:center; max-width:660px; margin:-8px auto 24px; color:var(--muted); font-size:.95rem; line-height:1.5; }

/* ---- Workshop 'document collage' — real rendered outputs, fanned on the dark section ---- */
.ws-docs { position:relative; max-width:680px; margin:42px auto 18px; height:430px; }
.ws-docs .doc { position:absolute; width:288px; height:350px; overflow:hidden; background:#fff; border:1px solid rgba(255,255,255,.16); border-radius:10px; box-shadow:0 26px 56px rgba(6,10,22,.5); margin:0; }
.ws-docs .doc img { width:100%; display:block; }
.ws-docs .doc figcaption { position:absolute; left:0; right:0; bottom:0; font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#fff; background:linear-gradient(transparent, rgba(20,26,46,.92)); padding:26px 14px 10px; }
.doc-a { left:392px; top:0;   transform:rotate(5deg);   z-index:1; }
.doc-b { left:260px; top:30px; transform:rotate(2deg);  z-index:2; }
.doc-c { left:132px; top:56px; transform:rotate(-2deg); z-index:3; }
.doc-d { left:0;     top:26px; transform:rotate(-5deg); z-index:4; }
@media (max-width:820px){ .ws-docs{max-width:340px;height:390px} .ws-docs .doc{width:230px;height:280px} .doc-a,.doc-b{display:none} .doc-c{left:auto;right:4px;top:0;transform:rotate(3deg)} .doc-d{left:0;top:34px} }
/* interactive collage — select a document to bring it forward */
.ws-docs .doc { cursor:pointer; transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s, filter .3s; }
.ws-docs .doc:focus { outline:none; }
.ws-docs .doc:focus-visible { outline:2px solid #dda06e; outline-offset:4px; }
.ws-docs .doc:hover { filter:brightness(1.06); }
.ws-docs.has-front .doc:not(.is-front) { filter:brightness(.5) saturate(.85); }
.ws-docs .doc.is-front { z-index:20; transform:scale(1.1) rotate(0deg); box-shadow:0 42px 84px rgba(6,10,22,.62); }
.ws-docs .doc.is-front figcaption { font-size:12px; padding:34px 14px 12px; background:linear-gradient(transparent, rgba(20,26,46,.96)); }
.ws-docs-hint { text-align:center; font-size:12.5px; color:rgba(255,255,255,.5); margin:2px 0 10px; letter-spacing:.02em; }
.ws-docs-hint span { color:#dda06e; font-weight:600; }
/* Workshop deep-dive page */
.workshop-page { padding-top: 64px; }
.workshop-page-title { text-align:center; margin-bottom: 4px !important; }
.workshop-descriptor { text-align:center; font-family: var(--serif); font-size: clamp(1.1rem,2.3vw,1.6rem); color:#dda06e; font-weight:500; margin:0 0 20px; letter-spacing:.01em; }
.ws-cta { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
.ws-cta-top { margin: 26px 0 6px; }
.ws-agenda { display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:22px 28px; margin: 44px 0 8px; }
.ws-agenda-copy { max-width: 72ch; }
.ws-agenda-copy h3 { margin-top:0; }
@media (max-width:820px){ .ws-agenda { flex-direction:column; align-items:flex-start; } }
/* homepage workshop teaser snapshot */
.ws-teaser-snap { max-width: 920px; margin: 30px auto 4px; display:grid; gap:12px; }
.ws-snap { font-size: 1.02rem; line-height:1.6; color: var(--text-inv-mut, #c7d0e0); margin:0; text-align:center; }
.ws-snap-h { color:#fff; font-weight:700; }

/* ---- Workshop side cards: lift off the dark section (was navy-on-navy) ---- */
.ws-card { background:rgba(255,255,255,.05); border:1px solid rgba(234,241,246,.14); border-left:3px solid var(--copper); border-radius:var(--radius); padding:22px 24px; }
.ws-delivery { margin-top:40px; }

/* Contact — two selectable options (form / email) on the dark contact section */
.contact-options { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 720px; margin: 0 auto 22px; text-align: left; }
.contact-opt { display: flex; flex-direction: column; gap: 8px; padding: 24px 22px; border-radius: var(--radius); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.14); text-decoration: none; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.contact-opt:hover { transform: translateY(-3px); background: rgba(255,255,255,.09); border-color: rgba(255,255,255,.30); }
.contact-opt-primary { border-color: rgba(180,112,58,.55); background: rgba(180,112,58,.11); }
.contact-opt-primary:hover { border-color: var(--copper); background: rgba(180,112,58,.17); }
.contact-opt-icon { color: var(--copper-light); line-height: 0; }
.contact-opt-icon svg { width: 26px; height: 26px; }
.contact-opt-h { font-family: var(--serif); font-weight: 600; font-size: 1.15rem; color: #fff; }
.contact-opt-d { font-size: .86rem; line-height: 1.5; color: rgba(255,255,255,.72); }
.contact-opt-cta { margin-top: 4px; font-size: .84rem; font-weight: 600; color: var(--copper-light); }
@media (max-width: 620px) { .contact-options { grid-template-columns: 1fr; } }

/* Workshop — "built on custom software" callout (dark section) */
.ws-software { display: flex; gap: 16px; align-items: flex-start; max-width: 760px; margin: 0 auto 44px; padding: 18px 22px; background: rgba(180,112,58,.10); border: 1px solid rgba(180,112,58,.35); border-radius: var(--radius); text-align: left; }
.ws-software-icon { color: var(--copper-light); flex: none; margin-top: 2px; line-height: 0; }
.ws-software-icon svg { width: 28px; height: 28px; }
.ws-software p { color: var(--text-inv-mut, #c7d0e0); font-size: .95rem; line-height: 1.6; margin: 0; }
.ws-software strong { color: #fff; }

/* Keynote section (light) */
.keynote { background: var(--paper); }
.keynote-lead { max-width: 72ch; margin: 0 auto 44px; text-align: center; color: var(--text-muted); font-size: 1.06rem; line-height: 1.75; }
.keynote-portrait { max-width: 360px; margin: 0 auto 44px; line-height: 0; }
.keynote-portrait img { width: 100%; height: auto; display: block; border-radius: 14px; box-shadow: 0 18px 50px rgba(20,24,38,.28); }
.keynote-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; max-width: 940px; margin: 0 auto; }
.keynote-block h4 { font-family: var(--serif); font-weight: 600; font-size: 1.2rem; color: var(--text-strong); margin: 0 0 16px; padding-bottom: 10px; border-bottom: 2px solid var(--copper); }
.keynote-block ul { list-style: none; display: flex; flex-direction: column; gap: 15px; }
.keynote-block li span { display: block; font-weight: 600; font-size: .95rem; color: var(--text-strong); }
.keynote-block li small { display: block; font-size: .85rem; color: var(--text-muted); margin-top: 3px; line-height: 1.5; }
.audience-chips { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 18px; }
.audience-chips span { font-size: .85rem; font-weight: 600; color: var(--ink-2, #2b3550); background: var(--paper-3, #efeae1); border: 1px solid var(--line); border-radius: 20px; padding: 7px 14px; }
.keynote-note { font-size: .9rem; color: var(--text-muted); line-height: 1.6; margin: 0; }
.keynote .ws-cta { display: flex; justify-content: center; margin-top: 42px; }
@media (max-width: 720px){ .keynote-cols { grid-template-columns: 1fr; } }

/* Sub-page back-to-home link (dark hero sections) */
.subpage-back { display: inline-block; font-size: .88rem; font-weight: 600; color: var(--copper-light); text-decoration: none; margin-bottom: 20px; }
.subpage-back:hover { color: #fff; }

/* ---- 3D hardcover book (book page) ---- */
.book3d-stage{ perspective:1700px; perspective-origin:50% 42%; display:flex; justify-content:center; align-items:flex-start; padding:8px 0 40px; }
.book3d-wrap{ position:relative; }
.book3d{ --w:264px; --h:396px; --d:44px; position:relative; width:var(--w); height:var(--h);
  transform-style:preserve-3d; transform:rotateX(6deg) rotateY(32deg);
  transition:transform .8s cubic-bezier(.2,.8,.2,1); will-change:transform; }
.book3d-wrap:hover .book3d, .book3d:focus-visible{ transform:rotateX(3deg) rotateY(15deg); outline:none; }
.book3d .face{ position:absolute; overflow:hidden; }
.book3d .f-front{ width:var(--w); height:var(--h); left:0; top:0; transform:translateZ(calc(var(--d)/2));
  border-radius:1px 4px 4px 1px; background:#111A29; box-shadow:inset 0 0 0 1px rgba(255,255,255,.05); }
.book3d .f-front img{ width:100%; height:100%; object-fit:cover; display:block; }
.book3d .f-front::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(105deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 80%, rgba(0,0,0,.14) 100%); }
.book3d .f-back{ width:var(--w); height:var(--h); left:0; top:0; transform:rotateY(180deg) translateZ(calc(var(--d)/2));
  background:linear-gradient(180deg,#16233f,#0e1930); border-radius:4px 1px 1px 4px; }
.book3d .f-spine{ width:var(--d); height:var(--h); left:calc((var(--w) - var(--d))/2); top:0;
  transform:rotateY(-90deg) translateZ(calc(var(--w)/2)); background:#0c1526; }
.book3d .f-spine img{ width:100%; height:100%; object-fit:cover; display:block; }
.book3d .f-pages{ width:var(--d); height:var(--h); left:calc((var(--w) - var(--d))/2); top:0;
  transform:rotateY(90deg) translateZ(calc(var(--w)/2));
  background:repeating-linear-gradient(90deg,#f3ecdb 0,#f3ecdb 1.2px,#d8ceb6 1.7px,#f3ecdb 2.6px); }
.book3d .f-top{ width:var(--w); height:var(--d); left:0; top:calc((var(--h) - var(--d))/2);
  transform:rotateX(90deg) translateZ(calc(var(--h)/2));
  background:repeating-linear-gradient(90deg,#f3ecdb 0,#f3ecdb 1.2px,#d8ceb6 1.7px,#f3ecdb 2.6px); }
.book3d .f-bottom{ width:var(--w); height:var(--d); left:0; top:calc((var(--h) - var(--d))/2);
  transform:rotateX(-90deg) translateZ(calc(var(--h)/2));
  background:repeating-linear-gradient(90deg,#e9e0cb 0,#e9e0cb 1.2px,#ccc1a6 1.7px,#e9e0cb 2.6px); }
.book3d-shadow{ position:absolute; left:50%; bottom:-24px; width:72%; height:24px;
  transform:translateX(-52%) rotateX(78deg); background:radial-gradient(ellipse at center, rgba(0,0,0,.45), rgba(0,0,0,0) 70%);
  filter:blur(7px); z-index:-1; }
@media (max-width:560px){ .book3d{ --w:200px; --h:300px; --d:34px; } }
@media (prefers-reduced-motion: reduce){ .book3d{ transition:none; } }

/* ---- Bulk / corporate orders CTA (book page) ---- */
.bulk-cta{ margin-top:24px; padding:20px 22px; display:flex; gap:20px; align-items:center; justify-content:space-between; flex-wrap:wrap;
  background:rgba(180,112,58,.10); border:1px solid rgba(180,112,58,.35); border-radius:var(--radius); }
.bulk-cta-copy{ max-width:52ch; }
.bulk-cta-copy h3{ margin:0 0 6px; font-size:1.05rem; color:var(--text-inv); }
.bulk-cta-copy p{ margin:0; font-size:.92rem; color:var(--text-muted); line-height:1.6; }
.bulk-cta-btn{ white-space:nowrap; flex:0 0 auto; }
@media (max-width:560px){ .bulk-cta{ flex-direction:column; align-items:flex-start; } }

/* ---- Book hero inline link + About the author ---- */
.hero-inline-link{ color:var(--copper-light); text-decoration:none; border-bottom:1px solid rgba(180,112,58,.5); }
.hero-inline-link:hover{ color:#fff; border-bottom-color:#fff; }
.author-sec{ background:var(--paper-3); border-top:1px solid var(--line); }
.author-inner{ display:grid; grid-template-columns:1fr auto; gap:44px; align-items:start; max-width:960px; }
.author-body{ order:1; } .author-photo{ order:2; }
.author-photo{ width:200px; height:auto; border-radius:var(--radius); box-shadow:var(--shadow); object-fit:cover; }
.author-body h2{ margin:0 0 16px; }
.author-body p{ color:var(--text-muted); font-size:1.02rem; line-height:1.75; margin-bottom:16px; max-width:64ch; }
.author-body .line-link{ display:inline-block; margin-top:6px; }
@media (max-width:640px){ .author-inner{ grid-template-columns:1fr; gap:22px; } .author-photo{ width:150px; } }

/* ---- Notify / launch signup (book page hero) ---- */
.notify-block{ margin-top:22px; max-width:520px; }
.notify-block > label{ display:block; font-size:.95rem; color:var(--text-inv-mut); margin-bottom:10px; }
.notify-form{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.notify-form input[type=email]{ flex:1; min-width:220px; max-width:340px; padding:12px 14px; font-size:1rem; border-radius:var(--radius); border:1px solid rgba(234,241,246,.22); background:rgba(234,241,246,.06); color:var(--text-inv); }
.notify-form input[type=email]::placeholder{ color:var(--text-inv-mut); }
.notify-form input[type=email]:focus{ outline:none; border-color:var(--copper); background:rgba(234,241,246,.10); }
.notify-note{ font-size:.8rem; color:var(--text-inv-mut); margin-top:10px; }
.notify-done{ font-size:1rem; color:var(--copper-light); font-weight:600; margin:4px 0; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---- Free sample chapter band (book page) ---- */
.sample-band{ background:var(--paper-3); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.sample-inner{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; max-width:1000px; }
.sample-h{ font-family:var(--serif); font-weight:600; font-size:1.9rem; color:var(--text-strong); margin:8px 0 12px; }
.sample-copy p{ color:var(--text-muted); font-size:1.02rem; line-height:1.7; max-width:44ch; }
.sample-form{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:12px; }
.sample-form .sf-h{ font-weight:600; color:var(--text-strong); font-size:1rem; }
.sample-form input{ padding:12px 14px; font-size:1rem; border:1.5px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); font-family:var(--sans); width:100%; }
.sample-form input:focus{ outline:none; border-color:var(--copper); }
.sf-consent{ display:flex; gap:9px; align-items:flex-start; font-size:.84rem; color:var(--text-muted); line-height:1.45; }
.sf-consent input{ width:auto; margin-top:3px; flex:0 0 auto; }
.sample-form .btn{ margin-top:4px; }
.sf-msg{ font-size:.85rem; margin:2px 0 0; min-height:1em; }
@media(max-width:720px){ .sample-inner{ grid-template-columns:1fr; gap:28px; } }
