/* ============================================================
   marketing.css — Part-3 (Marketing / LinkedIn Series) per-screen styles
   Sits ON shell.css tokens & frame; declares ONLY Marketing-specific
   rules (confidential band, gate pill, editorial rules, six-phase
   spine, seed cards, copy buttons + inline full-prompt field).
   No shell rule is re-declared here.  Prebuild decision #7.
   ============================================================ */

/* one token shell.css doesn't carry — the "Copied" green, from the
   approved mockup (shell has --ok #2e7d52; this matches the mockup exactly) */
:root{ --good:#2f6d4f; }

/* ---------- header: lock mark + row layout ----------
   shell.css already styles .hdr / .back / .kick / .ttl — these only ADD
   the row wrapper, the lock glyph, and a link-reset for the <a> back button */
.hdr__row{display:flex;align-items:center;justify-content:space-between;gap:.7rem}
.hdr .lockmark{width:26px;height:26px;flex:0 0 auto;opacity:.95}
.scr[data-screen="marketing"] .hdr .back{text-decoration:none}

/* ---------- marketing screen ---------- */
.scr[data-screen="marketing"]{background:var(--paper)}

/* confidential band — fixed under the header */
.cband{flex:0 0 auto;display:flex;align-items:center;gap:.5rem;padding:.5rem 1.2rem;background:var(--camel-tint);
  border-bottom:1px dashed var(--navy);color:var(--conf);font-size:.64rem;font-weight:700;letter-spacing:.02em}
.cband::before{content:'\26A0';font-size:.8rem}

.feed{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:.75rem 1.15rem 1rem}

/* info bar */
.infobar{display:flex;gap:.55rem;align-items:flex-start;margin:0 0 .95rem;padding:.6rem .7rem;
  border:1px solid var(--line-2);border-radius:11px;background:var(--indigo-tint)}
.infobar__ic{flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:var(--indigo);color:#fff;
  font-size:.66rem;font-weight:800;display:grid;place-items:center;margin-top:.05rem}
.infobar__t{font-size:.72rem;line-height:1.45;color:var(--ink-2)}
.infobar__t b{color:var(--indigo);font-weight:700}

/* intro */
.intro__kick{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--indigo);font-weight:700}
.intro h2{margin:.28rem 0 .35rem;font-size:1.12rem;line-height:1.26;font-weight:700;color:var(--navy);letter-spacing:-.01em}
.intro__stand{margin:0;font-size:.8rem;line-height:1.5;color:var(--ink-2)}

/* gated-to-you pill */
.gate{display:flex;align-items:center;gap:.55rem;margin:.85rem 0 .2rem;padding:.55rem .7rem;
  border:1px dashed var(--navy);border-radius:11px;background:linear-gradient(180deg,#fbfaf6,#f5f1e8)}
.gate__ic{width:20px;height:20px;flex:0 0 auto}
.gate__t{line-height:1.3;min-width:0}
.gate__t b{display:block;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:var(--conf);font-weight:700}
.gate__t span{font-size:.72rem;color:var(--ink-2);font-weight:600;word-break:break-all}

/* copy button */
.cbtn{display:inline-flex;align-items:center;gap:.3rem;border:1px solid var(--line-2);background:var(--paper);
  color:var(--indigo);font-family:var(--sans);font-size:.66rem;font-weight:700;letter-spacing:.02em;
  padding:.4rem .65rem;border-radius:8px;cursor:pointer;transition:.14s;white-space:nowrap;line-height:1}
.cbtn:hover{border-color:var(--indigo);background:var(--indigo-tint)}
.cbtn__ic{font-size:.72rem}
.cbtn--go{background:var(--indigo);color:#fff;border-color:var(--indigo)}
.cbtn--go:hover{background:#2f2f78;border-color:#2f2f78}
.cbtn--go.copied{background:var(--good);border-color:var(--good);color:#fff}
.cbtn--go.failed{background:var(--nobg);border-color:var(--no);color:var(--no);white-space:normal;text-align:left}

/* inline "Full prompt" field (deliberate reveal; also the copy-failure fallback) */
.copyfield{flex:1 0 100%;order:2;margin-top:.5rem;width:100%;min-height:150px;resize:vertical;
  font-family:ui-monospace,'Cascadia Mono','Consolas',monospace;font-size:.68rem;line-height:1.45;color:var(--ink);
  border:1px solid var(--line-2);border-radius:9px;background:var(--paper-2);padding:.55rem .6rem;-webkit-user-select:text;user-select:text}
.copyfield.warn{border-color:var(--no);background:#fffdfd}
.copyhint{flex:1 0 100%;order:1;margin-top:.4rem;font-size:.62rem;color:var(--ink-3);font-weight:600;line-height:1.4}
.copyhint.warn{color:var(--no)}
.cbtn--full.open{background:var(--indigo-tint);border-color:var(--indigo)}

/* editorial rules */
.rules{margin:.95rem 0 .3rem;border:1px solid var(--line-2);border-radius:12px;background:var(--paper-2);padding:.85rem .95rem .9rem}
.rules__h{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:0 0 .55rem}
.rules__h h4{margin:0;font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;color:var(--navy);font-weight:700}
.rules__ref{font-size:.55rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.rules ol{margin:0;padding-left:1.15rem;display:flex;flex-direction:column;gap:.42rem}
.rules li{font-size:.775rem;line-height:1.45;color:var(--ink-2)}
.rules li::marker{color:var(--indigo);font-weight:700}

/* six-phase spine */
.spine{position:relative;margin-top:1.1rem;padding-left:34px}
.spine::before{content:'';position:absolute;left:11px;top:4px;bottom:10px;width:2px;background:var(--line-2);border-radius:2px}
.phase{position:relative;margin:1.5rem 0 .55rem}
.phase:first-of-type{margin-top:.1rem}
.phase__node{position:absolute;left:-34px;top:-1px;width:24px;height:24px;border-radius:7px;background:var(--indigo);
  color:#fff;font-size:.78rem;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 4px var(--paper)}
.phase__name{font-size:.95rem;font-weight:700;color:var(--navy);letter-spacing:-.01em}
.phase__count{display:block;font-size:.55rem;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);font-weight:700;margin-top:.05rem}

.seed{position:relative;margin:.55rem 0;padding:.78rem .85rem;border:1px solid var(--line);border-radius:12px;
  background:var(--paper);box-shadow:0 10px 24px -20px rgba(48,32,80,.55)}
.seed__n{position:absolute;left:-34px;top:.78rem;width:24px;height:24px;border-radius:7px;background:var(--camel);
  color:var(--navy);font-size:.6rem;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 4px var(--paper)}
.seed__idea{margin:0 0 .15rem;font-size:.93rem;line-height:1.35;font-weight:700;color:var(--ink);letter-spacing:-.005em}
.seed__r{display:flex;gap:.5rem;margin-top:.42rem}
.seed__k{flex:0 0 40px;font-size:.53rem;letter-spacing:.09em;text-transform:uppercase;color:var(--indigo);font-weight:700;padding-top:.18rem}
.seed__r p{margin:0;font-size:.795rem;line-height:1.45;color:var(--ink-2)}
.seed__r--cite .seed__k{color:var(--amber)}
.seed__c{color:var(--amber)!important;font-weight:600;font-size:.75rem!important;line-height:1.4!important}
.seed__act{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.65rem;padding-top:.6rem;border-top:1px dashed var(--line)}

/* footer */
.mkfoot{flex:0 0 auto;padding:.55rem 1.2rem .95rem;border-top:1px solid var(--line);text-align:center}
.mkfoot p{margin:0;font-size:.6rem;letter-spacing:.02em;color:var(--ink-3);line-height:1.55}
.mkfoot b{color:var(--conf);font-weight:700}
.mkfoot code{font-size:.92em}
