/* Product copy: landing, save-your-progress, plans, privacy and terms. Builds on assessment.css (same colours and type). */
body.product{background:var(--cream)}
.product main{max-width:1040px;padding:0 0 32px;background:var(--cream);min-height:0}
.product .bar{display:flex;align-items:center;gap:10px;padding:14px 20px;border:0;margin:0}
.product .bar .mark{width:34px;height:34px;font-size:18px}
.product .bar b{font:700 19px Georgia;flex:1}
.product .bar a{color:var(--ink);font-size:14px;text-decoration:none;font-weight:600}
.product .sheet{background:var(--paper);border-radius:22px;margin:0 16px 16px;padding:28px 22px;box-shadow:0 1px 0 var(--line)}
.product .eyebrow{color:var(--sage);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin:0 0 10px}
.product .hero h1{font:700 34px/1.15 Georgia;margin:0 0 14px;letter-spacing:-.01em}
.product .hero .sub{font-size:18px;color:var(--muted);margin:0 0 22px;max-width:34em}
.cta{display:block;text-align:center;background:var(--rust);color:#fff;font-weight:700;font-size:18px;text-decoration:none;border-radius:14px;padding:16px 22px;border:0;width:100%}
.cta:hover,.cta:focus-visible{filter:brightness(1.06)}
.cta:focus-visible{outline:3px solid var(--sage);outline-offset:3px}
.price{text-align:center;color:var(--muted);font-size:14px;margin:10px 0 0}
.ai{display:flex;gap:10px;align-items:flex-start;background:var(--sage-soft);border-radius:12px;padding:11px 14px;font-size:14px;margin:20px 0 0}
.ai b{white-space:nowrap}
.product h2{font:700 22px Georgia;margin:0 0 14px}
.examples{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.example{display:block;border:1px solid var(--line);background:var(--field);border-radius:14px;padding:13px 15px;color:var(--ink);text-decoration:none}
.example b{display:block;font-size:16px}.example span{display:block;color:var(--muted);font-size:14px;margin-top:3px}
.example:hover{border-color:var(--sage)}
.how ol{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:step}
.how li{display:grid;grid-template-columns:36px 1fr;gap:2px 12px;counter-increment:step}
.how li::before{content:counter(step);grid-row:span 2;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--sage);color:#fff;font:700 16px Georgia}
.how li span{color:var(--muted);font-size:15px}
.coach{display:flex;gap:16px;align-items:center}
.coach img{width:76px;height:76px;border-radius:50%;object-fit:cover;flex:none}
.coach p{margin:0}.coach small{display:block;color:var(--muted);font-size:13px;margin-top:6px}
.product footer{text-align:center;font-size:14px;color:var(--muted);padding:8px 16px 24px}
.product footer a{color:var(--ink)}
.form{display:grid;gap:12px;margin:18px 0 0}
.form input{font-size:17px;padding:13px 14px;border-radius:12px}
.form button.cta{cursor:pointer}
.small{font-size:14px;color:var(--muted)}
.product .sheet a:not(.cta):not(.example){color:var(--ink)}
.honest{background:var(--warn-soft);border-left:4px solid #d6a63d;border-radius:6px;padding:12px 14px;margin:0 0 18px}
.plans{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.plan{border:1px solid var(--line);background:var(--field);border-radius:16px;padding:16px 18px}
.plan h3{margin:0;font:700 19px Georgia}.plan .price{text-align:left;font-size:17px;color:var(--ink);font-weight:700;margin:4px 0 6px}
.plan p{margin:0 0 12px}.plan button{width:100%;border-radius:12px;padding:12px}
.thanks{background:var(--go-soft);color:var(--ink);border-radius:14px;padding:16px 18px;font-size:17px}
.draft{background:var(--over-soft);color:var(--over);border-radius:10px;padding:10px 14px;font-weight:700;margin:0 0 18px}
.legal h2{font-size:18px;margin:22px 0 6px}.legal p,.legal li{font-size:15px}
@media (min-width:860px){
  .product .bar{padding:20px 32px}
  .product .sheet{margin:0 32px 20px;padding:40px 48px}
  .landing .top{display:grid;grid-template-columns:1.15fr 1fr;gap:20px;margin:0 32px 20px}
  .landing .top .sheet{margin:0}
  .product .hero h1{font-size:46px}
  .hero .cta{display:inline-block;width:auto;min-width:260px}.hero .price{text-align:left}
  .examples{grid-template-columns:1fr}
  .how ol{grid-template-columns:repeat(3,1fr)}.how li{grid-template-columns:1fr}.how li::before{grid-row:auto;margin-bottom:8px}
  .narrow{max-width:620px;margin:0 auto 20px!important}
  .plans{grid-template-columns:repeat(3,1fr)}
}
