/* Lines That Land — measured from thematchlab.co/blog-lines-that-land */
:root{
  --ink:#1a1512;--cream:#fcf7ec;--paper:#fffdf6;--butter:#ffe785;--lilac:#ddccff;
  --sky:#bfe2ff;--mint:#bdeecf;--peach:#ffcda8;--coral:#ff5a3c;--cobalt:#2f44ff;
  --pink:#ff8fb1;--sand:#e9e0cf;
}
body.lines-page{
  background:var(--sand);color:var(--ink);
  font-family:'Onest',system-ui,sans-serif;font-size:18px;line-height:1.55;
  padding:10px 10px 0;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.lines-page a{color:var(--cobalt)}
.lines-page .disp{font-family:'Onest',sans-serif;font-weight:800;letter-spacing:-.03em;line-height:.92}
.lines-page .mono{font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem}
.lines-page .bar{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 20px;background:rgba(252,247,236,.85);backdrop-filter:blur(10px);
  border:2.5px solid var(--ink);border-radius:50px;margin-bottom:10px;
}
.lines-page .logo{
  font-family:'Onest',sans-serif;font-weight:800;font-size:1.05rem;display:flex;align-items:center;gap:8px;
  text-decoration:none;color:var(--ink);white-space:nowrap;
}
.lines-page .logo .dot{width:11px;height:11px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 3px var(--ink)}
.lines-page .bar .cta,.lines-page .bar button.cta{
  font-family:'IBM Plex Mono',monospace;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;
  background:var(--ink);color:var(--cream);text-decoration:none;padding:11px 18px;border-radius:40px;
  border:2.5px solid var(--ink);white-space:nowrap;cursor:pointer;
}
.lines-page section,.lines-page header.hero{
  border-radius:38px;padding:clamp(40px,6vw,84px) clamp(22px,5vw,60px);margin-bottom:10px;position:relative;overflow:hidden;
}
.lines-page .wrap{max-width:1080px;margin:0 auto;position:relative;z-index:2}
.lines-page header.hero{background:var(--coral);color:var(--paper)}
.lines-page .hero .eyebrow{background:var(--ink);color:var(--cream)}
.lines-page .eyebrow{
  font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;
  background:var(--ink);color:var(--cream);padding:7px 15px;border-radius:30px;display:inline-block;margin-bottom:22px;
}
.lines-page h1{font-size:clamp(2.4rem,8vw,5rem);max-width:16ch;font-family:'Onest',sans-serif;font-weight:800;letter-spacing:-.03em;line-height:.92}
.lines-page .hero p{max-width:48ch;margin-top:18px;font-size:1.15rem}
.lines-page .sec-h{font-size:clamp(1.9rem,5vw,3.2rem);max-width:20ch;font-family:'Onest',sans-serif;font-weight:800;letter-spacing:-.03em;line-height:.92}
.lines-page .sec-lead{max-width:54ch;margin:14px 0 8px;font-size:1.08rem}
.lines-page .tag{font-family:'IBM Plex Mono',monospace;font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;opacity:.7;margin-bottom:6px}
.lines-page .phrases{background:var(--butter)}
.lines-page .openers{background:var(--sky)}
.lines-page .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:40px}
.lines-page .card{
  background:var(--paper);border:2.5px solid var(--ink);border-radius:24px;padding:26px 26px 24px;
  box-shadow:7px 7px 0 var(--ink);position:relative;transition:transform .25s cubic-bezier(.34,1.5,.6,1);
}
.lines-page .card:hover{transform:translateY(-6px) rotate(-1deg)}
.lines-page .card:nth-child(2n){transform:rotate(1deg)}
.lines-page .card:nth-child(2n):hover{transform:translateY(-6px) rotate(0)}
.lines-page .card .quote{font-family:'Onest',sans-serif;font-weight:700;font-size:1.35rem;line-height:1.2;letter-spacing:-.01em}
.lines-page .card .quote .v{background:var(--coral);color:var(--paper);padding:0 .25em;border-radius:6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lines-page .openers .card .quote .v{background:var(--cobalt)}
.lines-page .card .why{
  font-family:'IBM Plex Mono',monospace;font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;
  color:#8a7d66;margin-top:14px;border-top:1.5px dashed var(--ink);padding-top:10px;
}
.lines-page .pin{
  position:absolute;top:-12px;right:18px;width:30px;height:30px;border-radius:50%;
  background:var(--pink);border:2.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);
}
.lines-page .openers .pin{background:var(--coral)}
.lines-page .rules{background:var(--ink);color:var(--cream)}
.lines-page .rules .eyebrow{background:var(--cream);color:var(--ink)}
.lines-page .rules ol{counter-reset:r;list-style:none;margin-top:32px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.lines-page .rules li{counter-increment:r;border:2.5px solid var(--cream);border-radius:22px;padding:24px}
.lines-page .rules li::before{content:"0" counter(r);font-family:'Onest',sans-serif;font-weight:800;font-size:2.2rem;color:var(--coral);display:block;margin-bottom:8px}
.lines-page .rules li b{font-family:'Onest',sans-serif;font-size:1.1rem;display:block;margin-bottom:4px}
.lines-page .rules li span{font-size:.95rem;opacity:.85}
.lines-page .cta-box{background:var(--coral);color:var(--paper);border-radius:38px;padding:clamp(40px,6vw,72px);text-align:center;margin-bottom:10px}
.lines-page .cta-box h3{font-family:'Onest',sans-serif;font-weight:800;font-size:clamp(1.8rem,5vw,2.8rem);margin-bottom:12px;letter-spacing:-.02em}
.lines-page .cta-box button,.lines-page .cta-box .cta{
  display:inline-block;background:var(--ink);color:var(--cream);text-decoration:none;
  font-family:'IBM Plex Mono',monospace;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;
  padding:16px 30px;border-radius:40px;margin-top:14px;border:2.5px solid var(--ink);cursor:pointer;
}
.lines-page .more-links{text-align:center;padding:10px 20px 0;font-family:'IBM Plex Mono',monospace;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.lines-page .more-links a{color:var(--coral);margin:0 .4em}
@media(max-width:720px){
  .lines-page .grid,.lines-page .rules ol{grid-template-columns:1fr}
  .lines-page .card:nth-child(2n){transform:none}
  body.lines-page{padding:6px 6px 0}
  .lines-page section,.lines-page header.hero,.lines-page .cta-box{border-radius:28px}
}