/* Shared public acquisition and template-gallery document layout. */
.marketing-page main > section:not(.hero){padding:64px 0;border-top:1px solid var(--line)}
.marketing-page main p{line-height:1.7;margin:16px 0;max-width:78ch}
.marketing-page main ol{padding-left:24px;max-width:78ch;line-height:1.8}
.marketing-page main li{margin:16px 0}
.marketing-page .feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:32px}
.marketing-page article{padding:24px 0;border-top:1px solid var(--line)}
.marketing-page h3{font-family:var(--display);font-size:1.4rem;line-height:1.3}
.marketing-page table{border-collapse:collapse;min-width:640px;width:100%;margin:24px 0;line-height:1.6}
.marketing-page th,.marketing-page td{text-align:left;vertical-align:top;border-bottom:1px solid var(--line);padding:16px}
.marketing-page th{background:var(--blue-soft)}
.marketing-page details{padding:16px 0;border-top:1px solid var(--line);max-width:78ch}
.marketing-page summary{cursor:pointer;font-weight:700}
.marketing-page .public-connect{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}
.marketing-page .public-connect a{text-decoration:underline;text-underline-offset:4px;color:var(--blue)}
@media(max-width:640px){.marketing-page .feature-grid{grid-template-columns:1fr}.marketing-page main > section:not(.hero){padding:36px 0}.marketing-page .nav{flex-wrap:wrap;gap:16px}.marketing-page .nav nav{display:flex;flex-wrap:wrap;gap:14px}.marketing-page h1{overflow-wrap:break-word}}

/* Public pages share the app's paper, cobalt, cards and progressive sections. */
.marketing-page .nav { min-height:76px; height:auto; padding-top:14px; padding-bottom:14px; }
.marketing-page .site-header { background:var(--paper); }
.marketing-page .nav a[aria-current="page"] { font-weight:600; color:var(--blue); }
.marketing-page .logo img { flex-shrink:0; }
.marketing-page main .section-lede { color:var(--muted); max-width:64ch; font-size:1.05rem; }
.marketing-page main .actions { margin-top:28px; }
.marketing-page .memory-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; list-style:none; max-width:none; padding:0; margin:36px 0 0; }
.marketing-page .memory-steps li { margin:0; padding:24px 0 0; border-top:1px solid var(--line); }
.step-number { display:block; color:var(--blue); font: .75rem var(--mono); margin-bottom:20px; }
.marketing-page .memory-steps h3 { font-size:1.2rem; }
.marketing-page .memory-steps p { margin-bottom:0; color:var(--muted); font-size:.9rem; }
.state-features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:32px; }
.marketing-page .state-feature { min-width:0; padding:24px; border:1px solid var(--line); border-radius:12px; background:var(--white); }
.marketing-page .state-feature h3 { margin-top:22px; font-size:1.35rem; }
.marketing-page .state-feature > p { margin:12px 0 0; font-size:.9rem; color:var(--muted); }
.feature-visual { min-height:240px; border:1px solid #e0e3ee; border-radius:8px; background:var(--paper); padding:20px; font-size:.8rem; line-height:1.5; }
.visual-label { display:block; font:.62rem/1.6 var(--mono); letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; }
.marketing-page .feature-visual p { margin:3px 0 0; font-size:.79rem; line-height:1.6; color:var(--muted); }
.mini-log { display:flex; gap:12px; align-items:flex-start; padding:10px 0; }
.mini-log + .mini-log { border-top:1px solid var(--line); margin-top:7px; }
.mini-dot { width:7px; height:7px; flex-shrink:0; margin-top:7px; border-radius:50%; background:var(--blue); }
.mini-dot.muted { background:#a8b2c8; }
.mini-meta { display:block; margin-top:6px; color:var(--blue); font-size:.71rem; }
.mini-reference { display:flex; align-items:center; gap:12px; background:var(--white); border:1px solid var(--line); border-radius:5px; margin-top:8px; padding:9px 11px; }
.mini-reference > span:last-child { margin-left:auto; color:var(--blue); }
.reference-kind { width:34px; color:var(--blue); font:.58rem var(--mono); }
.mini-reference strong { min-width:0; font-weight:500; }
.mini-state { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; padding:11px 12px; border:1px solid var(--line); border-radius:6px; background:var(--white); }
.mini-state.review { border-color:#e8d7b6; background:#fffcf5; }
.mini-badge { display:inline-block; flex-shrink:0; padding:3px 7px; border-radius:4px; font-size:.63rem; line-height:1.4; font-weight:500; }
.mini-badge.green { background:var(--green-soft); color:var(--green); }
.mini-badge.amber { background:var(--amber-soft); color:var(--amber); }
.mini-badge.blue { background:var(--blue-soft); color:var(--blue); }
.dependency-connector { margin-left:18px; height:25px; line-height:25px; color:#a69877; }
.marketing-page .feature-visual .visual-footnote { margin-top:10px; font-size:.7rem; color:var(--amber); }
.mini-revision { display:flex; align-items:flex-start; gap:12px; padding:14px 0; }
.mini-revision > div { flex:1; min-width:0; }
.mini-revision.previous { border-top:1px solid var(--line); color:var(--muted); }
.revision-number { color:var(--blue); font:.67rem/1.8 var(--mono); }
.comparison-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:10px; margin:28px 0 0; }
.comparison-scroll:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
.marketing-page main .comparison-scroll-hint { display:none; }
.marketing-page .comparison-scroll table { margin:0; font-size:.9rem; }
.marketing-page .comparison-scroll th { font-size:.8rem; }
.marketing-page .comparison-scroll td:first-child { width:23%; }
.marketing-page .comparison-scroll td:nth-child(2) { width:20%; }
.marketing-page .comparison-scroll tr:last-child td { border-bottom:0; }
.marketing-page .segue-comparison td { background:var(--blue-soft); color:#172c9d; }
.marketing-page .segue-comparison td:first-child { box-shadow:inset 3px 0 0 var(--blue); }
.marketing-page .segue-comparison strong { font-weight:700; }
.marketing-page main .comparison-note { font-size:.85rem; color:var(--muted); }
.tool-roles { display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr); align-items:center; gap:12px; margin:32px 0; }
.tool-roles > div { display:flex; flex-direction:column; align-items:flex-start; align-self:stretch; gap:16px; padding:24px; background:var(--white); border:1px solid var(--line); border-radius:10px; }
.role-icon { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--line); border-radius:7px; color:var(--blue); font: .9rem var(--mono); }
.role-plus { text-align:center; color:var(--muted); }
.tool-roles > .role-segue { background:var(--blue-soft); border-color:#cbd1f6; }
.marketing-page .tool-roles p { margin:0; font-size:.8rem; color:var(--muted); }
.template-page .hero h1 { font-size:clamp(2.4rem,4.7vw,3.8rem); max-width:900px; }
.marketing-page main .template-hero-note { font-size:.85rem; color:var(--muted); }
.template-preview-intro { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:28px; }
.template-preview-intro .eyebrow { margin-top:0; }
.marketing-page .template-preview-intro p { color:var(--muted); }
.section-count { flex-shrink:0; padding:8px 12px; border:1px solid var(--line); border-radius:6px; color:var(--blue); font:.7rem var(--mono); }
.template-workspace { overflow:hidden; border:1px solid var(--line); border-radius:12px; background:var(--white); }
.template-workspace-bar { display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; align-items:center; padding:16px 24px; border-bottom:1px solid var(--line); font:.68rem var(--mono); color:var(--muted); }
.template-workspace-bar > span:first-child { color:var(--ink); }
.template-workspace-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:40px; padding:30px; }
.template-workspace-grid.single { grid-template-columns:minmax(0,1fr); }
.template-workspace-grid > * { min-width:0; }
.template-group-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.marketing-page .template-group-head h3 { font:600 1rem var(--body); letter-spacing:normal; }
.template-group-head > span { font:.62rem var(--mono); color:var(--muted); }
.marketing-page main .template-group-hint { color:var(--muted); font-size:.8rem; margin:8px 0 18px; }
.marketing-page .template-workspace .template-field { max-width:none; padding:0; border-top:0; border-bottom:1px solid var(--line); }
.template-field > summary { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:17px 0; list-style:none; }
.template-field > summary::-webkit-details-marker { display:none; }
.template-field-label { display:flex; flex-direction:column; gap:7px; min-width:0; }
.template-field-label > strong { font-size:.9rem; font-weight:600; line-height:1.5; }
.template-field-meta { display:flex; align-items:center; flex-wrap:wrap; gap:10px; color:var(--muted); font-size:.69rem; font-weight:400; }
.required-marker { padding:1px 6px; border-radius:4px; background:var(--blue-soft); color:var(--blue); font-size:.61rem; }
.template-field-plus { flex-shrink:0; width:18px; height:18px; position:relative; color:var(--blue); }
.template-field-plus::before,.template-field-plus::after { content:""; position:absolute; left:3px; top:8px; width:12px; height:1.5px; background:currentColor; }
.template-field-plus::after { transform:rotate(90deg); }
.template-field[open] > summary .template-field-plus::after { transform:rotate(0); }
.template-field[open] > summary { color:var(--blue); }
.template-field-body { padding:4px 0 22px; }
.template-field-body .visual-label { margin-bottom:8px; }
.marketing-page main .template-field-body p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.85rem; line-height:1.8; margin:0; }
.template-review-cadence { display:block; margin-top:12px; color:var(--muted); font:.63rem var(--mono); }
.marketing-page .template-workspace .full-instructions { padding:12px 14px; border:1px solid var(--line); border-radius:6px; background:var(--paper); margin-top:14px; max-width:none; font-size:.78rem; }
.full-instructions > summary { color:var(--blue); }
.marketing-page main .full-instructions p { margin-top:12px; }
.template-log-note { border:1px solid #dfe3f4; border-radius:8px; background:#f7f8fe; margin-top:24px; padding:18px; }
.template-log-note .visual-label { color:var(--blue); margin-bottom:8px; }
.marketing-page .template-log-note p { margin:0; color:var(--muted); font-size:.8rem; }
.template-workspace-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; padding:22px 30px; background:var(--paper); border-top:1px solid var(--line); }
.marketing-page main .template-workspace-footer p { margin:0; max-width:48ch; font-size:.8rem; color:var(--muted); }
.marketing-page .gallery-card { padding:26px; border:1px solid var(--line); border-radius:10px; background:var(--white); }
.marketing-page .gallery-card h2 { font-size:1.6rem; letter-spacing:-.02em; }
.marketing-page .gallery-card p { font-size:.9rem; color:var(--muted); }
@media (max-width:800px) {
  .marketing-page .memory-steps { grid-template-columns:minmax(0,1fr); gap:20px; }
  .step-number { margin-bottom:12px; }
  .state-features { grid-template-columns:minmax(0,1fr); }
  .tool-roles { grid-template-columns:minmax(0,1fr); gap:12px; }
  .tool-roles > div { gap:12px; }
  .role-plus { height:20px; }
  .template-workspace-grid { grid-template-columns:minmax(0,1fr); gap:32px; padding:24px; }
  .template-workspace-footer { padding:22px 24px; }
}
@media (max-width:640px) {
  html { scroll-padding-top:124px; }
  .marketing-page main .comparison-scroll-hint { display:block; margin:10px 0 0; font-size:.72rem; color:var(--muted); }
  .marketing-page .nav { align-items:stretch; gap:12px; }
  .marketing-page .nav .logo { align-self:flex-start; }
  .marketing-page .nav nav { width:100%; justify-content:space-between; gap:9px; font-size:12px; }
  .marketing-page .nav .button.small { padding:8px 11px; min-height:36px; font-size:12px; gap:8px; }
  .marketing-page .state-feature { padding:18px; }
  .feature-visual { padding:16px; min-height:200px; }
  .mini-state,.mini-revision { gap:8px; }
  .mini-revision { flex-wrap:wrap; }
  .mini-revision .mini-badge { margin-left:30px; }
  .template-preview-intro { align-items:flex-start; flex-direction:column; gap:12px; }
  .template-workspace-bar { padding:14px 18px; font-size:.6rem; }
  .template-workspace-grid { padding:20px; }
  .template-field-label > strong { font-size:.85rem; }
  .template-workspace-footer { padding:20px; }
  .template-workspace-footer .button { width:100%; }
}
