/* landing page template */
.lp{max-width:1180px;margin:0 auto;padding:0 20px;color:#4f4940;font:16px/1.65 -apple-system,BlinkMacSystemFont,"Inter","Segoe UI",sans-serif}
.lp-hero{text-align:center;max-width:820px;margin:0 auto;padding:clamp(48px,7vw,104px) 0 clamp(36px,5vw,64px)}
.lp-title{margin:0;font:700 clamp(32px,4.6vw,58px)/1.06 "Syne",sans-serif;text-transform:uppercase;letter-spacing:.015em;color:#5a534a}
.lp-lead{margin:16px auto 26px;max-width:46ch;font-size:clamp(17px,1.5vw,19px);color:#6b645a}
.lp-props{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);padding:clamp(28px,4vw,44px) 0;border-top:1px solid rgba(47,43,38,.14);border-bottom:1px solid rgba(47,43,38,.14)}
.lp-prop h3,.lp-feats h3{margin:0 0 6px;font:500 18px/1.3 "Archivo Expanded",sans-serif;font-stretch:125%;color:#5a534a}
.lp-prop p{margin:0;color:#6b645a}
.lp-block{padding-top:clamp(72px,9vw,128px)}
.lp-h{margin:0 0 10px;text-align:center;font:500 clamp(24px,2.6vw,34px)/1.2 "Archivo Expanded",sans-serif;font-stretch:125%;color:#5a534a}
.lp-sub{margin:0 auto 32px;max-width:62ch;text-align:center;color:#6b645a}
.lp-feats{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:26px 36px}
.lp-feats h3{font-size:15.5px}.lp-feats p{margin:0;font-size:14.5px;color:#6b645a}
.lp-more{text-align:center;margin:32px 0 0}.lp-more a{color:#2f2b26;font-weight:500;text-decoration:none;border-bottom:1px solid rgba(47,43,38,.35)}
.lp-secs{display:grid;gap:clamp(64px,8vw,112px);padding-top:clamp(72px,9vw,128px)}
.lp-sec{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.lp-sec:nth-child(even) .lp-sec-text{order:2}
.lp-sec--noimg{grid-template-columns:1fr;max-width:760px;margin:0 auto;text-align:center}
.lp-sec h2{margin:0 0 12px;font:500 clamp(22px,2.3vw,30px)/1.25 "Archivo Expanded",sans-serif;font-stretch:125%;color:#5a534a}
.lp-sec p{margin:0;color:#6b645a}
.lp-sec-img img{width:100%;height:auto;display:block;border-radius:14px}
.lp-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px}
.lp-card{margin:0}.lp-card-img{aspect-ratio:1;border-radius:12px;overflow:hidden;background:#ece7dd}.lp-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.lp-card figcaption{margin-top:8px;font-size:14px;color:#5a534a;font-weight:500}
.lp-lumber{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.lp-lumber img{width:100%;height:auto;display:block;border-radius:10px}
.lp-faq{max-width:760px;margin:0 auto}
.lp-q{border-bottom:1px solid rgba(47,43,38,.14);padding:4px 0}
.lp-q summary{cursor:pointer;list-style:none;padding:14px 32px 14px 0;position:relative;font-weight:600;color:#2f2b26}
.lp-q summary::-webkit-details-marker{display:none}
.lp-q summary::after{content:"+";position:absolute;right:4px;top:10px;font:400 22px/1 -apple-system,sans-serif;color:#8f877b;transition:transform .2s}
.lp-q[open] summary::after{transform:rotate(45deg)}
.lp-q p{margin:0 0 16px;color:#6b645a}
.lp-closing{text-align:center;padding:clamp(80px,10vw,140px) 0 0}
.lp-closing-guy{display:block;width:56px;height:58px;margin:0 auto 14px;color:#5a534a}.lp-closing-guy svg{width:100%;height:100%;display:block}
.lp-closing h2{margin:0;font:700 clamp(26px,3.4vw,42px)/1.1 "Syne",sans-serif;text-transform:uppercase;color:#5a534a}
.lp-closing p{margin:12px 0 24px;color:#6b645a}
@media (max-width:820px){.lp-props{grid-template-columns:1fr}.lp-sec{grid-template-columns:1fr}.lp-sec:nth-child(even) .lp-sec-text{order:0}.lp-lumber{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.lp-gallery{grid-template-columns:1fr 1fr;gap:12px}}

/* ===== designed material landing pages (.lp-designed): same type and rhythm as the homepage ===== */
.lp-designed{--ink:#2f2b26;--head:#857c70;--body:#6b645a;--muted:#9a9184;--rule:rgba(47,43,38,.14);max-width:1180px}
.lp-designed .lp-eyebrow{margin:0 0 14px;color:var(--muted);font:500 11px/1 -apple-system,BlinkMacSystemFont,"Inter",sans-serif;letter-spacing:.18em;text-transform:uppercase;text-align:center}
.lp-designed :is(.lp-h2,.lp-h,.lp-sec h2){font:400 clamp(23px,2.3vw,30px)/1.25 "Archivo Expanded",sans-serif;font-stretch:125%;color:var(--head);margin:0 0 14px}
.lp-designed :is(h2.lp-h2,h2.lp-h){text-align:center;max-width:24ch;margin-left:auto;margin-right:auto;text-wrap:balance}
.lp-designed .lp-h3{font:400 19px/1.3 "Archivo Expanded",sans-serif;font-stretch:125%;color:var(--head);text-align:center;margin:clamp(48px,6vw,72px) 0 18px}
.lp-designed .lp-intro{max-width:62ch;margin:0 auto 36px;text-align:center;color:var(--body);font-size:17px;text-wrap:pretty}
/* section rhythm: every major block opens with a hairline like the homepage's feature divider */
.lp-designed > :is(.lp-how,.lp-parts,.lp-faq-block,.lp-related,.cms-gallery-block){position:relative;padding-top:clamp(72px,9vw,120px);margin-top:clamp(56px,7vw,96px)}
.lp-designed > :is(.lp-how,.lp-parts,.lp-faq-block,.lp-related,.cms-gallery-block)::before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,rgba(47,43,38,0),rgba(47,43,38,.22) 20%,rgba(47,43,38,.22) 80%,rgba(47,43,38,0))}
.lp-designed > .features{margin-top:clamp(56px,7vw,96px)}

/* breadcrumb + hero */
.lp-crumbs{display:flex;justify-content:center;gap:8px;padding-top:clamp(28px,4vw,48px);font-size:13px;color:var(--muted)}
.lp-crumbs a{color:var(--body);text-decoration:none;border-bottom:1px solid rgba(47,43,38,.25)}.lp-crumbs a:hover{color:var(--ink)}
.lp-designed .lp-hero{padding-top:clamp(20px,3vw,36px);padding-bottom:0;max-width:880px}
.lp-designed .lp-lead{max-width:56ch;text-wrap:pretty}
.lp-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 24px}
.lp-link{color:var(--ink);font-weight:500;text-decoration:none;border-bottom:1px solid rgba(47,43,38,.35);padding-bottom:1px}.lp-link:hover{border-bottom-color:var(--ink)}
.lp-facts{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 0;margin:36px auto 0;padding:0;max-width:1180px;font-size:14px;color:var(--body)}
.lp-facts li{padding:0 16px;border-left:1px solid var(--rule)}.lp-facts li:first-child{border-left:0}

/* how it works */
.lp-steps{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.lp-step{position:relative;text-align:left;padding:28px 26px 26px;border:1px solid var(--rule);border-radius:16px;background:rgba(255,253,248,.45)}
.lp-step-n{display:block;margin-bottom:18px;font:300 30px/1 "Archivo Expanded",sans-serif;font-stretch:125%;color:#b3aa9c}
.lp-step h3{margin:0 0 8px;font:400 19px/1.3 "Archivo Expanded",sans-serif;font-stretch:125%;color:var(--head)}
.lp-step p{margin:0;color:var(--body);font-size:15.5px;line-height:1.6}
.lp-step-more{display:inline-block;margin-top:14px;font-size:14px;color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(47,43,38,.3)}.lp-step-more:hover{border-bottom-color:var(--ink)}

/* curated features: the "see all" link under the stack */
.features--curated .feat-all{text-align:center;margin:clamp(40px,5vw,64px) 0 0}
.features--curated .feat-all a,.feat-nav .nav-all{color:#2f2b26;font-weight:500;text-decoration:none;border-bottom:1px solid rgba(47,43,38,.35)}
.feat-nav .nav-all{display:inline-block;margin:16px 0 0 14px;font-size:13px}

/* parts library counts */
.lp-part-groups{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:16px;overflow:hidden}
.lp-part-groups li{background:#F5F2EC;padding:26px 24px 24px}
.lp-count{display:block;font:300 clamp(30px,3vw,40px)/1 "Archivo Expanded",sans-serif;font-stretch:125%;color:#5a534a;margin-bottom:10px}
.lp-part-groups h3{margin:0 0 6px;font:600 15px/1.35 -apple-system,BlinkMacSystemFont,"Inter",sans-serif;color:var(--ink)}
.lp-part-groups p{margin:0;font-size:14.5px;line-height:1.55;color:var(--body)}
.lp-parts-note{text-align:center;margin:18px 0 0;font-size:13.5px;color:var(--muted)}
.lp-parts-note a{color:var(--body)}

/* CMS sections, restyled to the same scale */
.lp-designed .lp-secs{padding-top:clamp(72px,9vw,120px)}
.lp-designed .lp-sec p{font-size:16.5px;line-height:1.65;color:var(--body)}
.lp-designed .lp-sec--noimg h2{text-align:center}
.lp-designed .cms-gallery-block .lp-sub{max-width:60ch}

/* FAQ accordion */
.lp-designed .lp-faq{max-width:820px;margin:28px auto 0;border-top:1px solid var(--rule)}
.lp-designed .lp-q{border-bottom:1px solid var(--rule);padding:0}
.lp-designed .lp-q summary{padding:20px 44px 20px 0;font:500 17px/1.4 -apple-system,BlinkMacSystemFont,"Inter",sans-serif;color:var(--ink)}
.lp-designed .lp-q summary::after{top:17px;right:6px}
.lp-designed .lp-q summary:hover{color:#000}
.lp-designed .lp-q summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:4px}
.lp-a{padding:0 44px 20px 0;color:var(--body);font-size:16px;line-height:1.65}
.lp-a p{margin:0 0 .8em}.lp-a p:last-child{margin-bottom:0}

/* related materials + guides */
.lp-materials{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px}
.lp-materials a{display:block;text-decoration:none;color:var(--ink)}
.lp-mat-img{display:block;aspect-ratio:2.36;border-radius:12px;overflow:hidden;background:#efe9df}
.lp-mat-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}.lp-materials a:hover img{transform:scale(1.04)}
.lp-mat-title{display:block;margin-top:10px;font-weight:500;font-size:15px}.lp-materials a:hover .lp-mat-title{text-decoration:underline;text-underline-offset:3px}
.lp-guides{list-style:none;margin:0 auto;padding:0;max-width:980px;display:grid;grid-template-columns:repeat(2,1fr);gap:22px 40px}
.lp-guides a{font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(47,43,38,.3)}.lp-guides a:hover{border-bottom-color:var(--ink)}
.lp-guides p{margin:6px 0 0;font-size:14.5px;line-height:1.55;color:var(--body)}

@media (max-width:820px){
  .lp-steps{grid-template-columns:1fr;gap:36px}
  .lp-guides{grid-template-columns:1fr}
  .lp-facts{flex-direction:column;align-items:center;gap:6px}.lp-facts li{border-left:0;padding:0}
}

/* "Why Crafti" value cards (the page's four CMS value sections, one illustration each) */
.lp-designed > .lp-values{position:relative;padding-top:clamp(72px,9vw,120px);margin-top:clamp(56px,7vw,96px)}
.lp-designed > .lp-values::before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,rgba(47,43,38,0),rgba(47,43,38,.22) 20%,rgba(47,43,38,.22) 80%,rgba(47,43,38,0))}
.lp-value-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.4vw,28px);margin-top:40px}
.lp-value{display:grid;grid-template-columns:clamp(110px,12vw,150px) 1fr;gap:clamp(16px,2vw,26px);align-items:start;padding:clamp(22px,2.6vw,32px);border:1px solid var(--rule);border-radius:18px;background:rgba(255,253,248,.45)}
.lp-value-img figure{margin:0}
.lp-value-img img{width:100%;height:auto;display:block;mix-blend-mode:darken}
.lp-designed .lp-value h3{margin:0 0 10px;font:400 clamp(18px,1.6vw,21px)/1.3 "Archivo Expanded",sans-serif;font-stretch:125%;color:var(--head)}
.lp-designed .lp-value p{margin:0 0 .7em;font-size:15.5px;line-height:1.6;color:var(--body)}
.lp-designed .lp-value p:last-child{margin-bottom:0}

/* lean bodies: extra paragraphs behind "Read more" (they stay in the page) */
.lp-more{margin-top:4px}
.lp-more summary{display:inline-block;cursor:pointer;list-style:none;font-size:14px;font-weight:500;color:var(--ink);border-bottom:1px solid rgba(47,43,38,.3);padding-bottom:1px}
.lp-more summary::-webkit-details-marker{display:none}
.lp-more summary:hover{border-bottom-color:var(--ink)}
.lp-more[open] summary{display:none}
.lp-more[open] > :first-of-type{margin-top:.7em}

/* the later CMS sections as compact rows: smaller media, tighter gaps, one rhythm */
.lp-designed .lp-rows{gap:clamp(48px,6vw,80px)}
.lp-designed .lp-rows .lp-sec{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,4vw,56px)}
.lp-designed .lp-rows .lp-sec:nth-child(even){grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.lp-designed .lp-rows .lp-sec--noimg{grid-template-columns:1fr;max-width:720px}
.lp-designed .lp-rows :is(.cms-sec--shots,.cms-sec--gallery){grid-template-columns:1fr}
.lp-designed .lp-sec--why{padding:clamp(28px,3.6vw,44px) clamp(24px,4vw,56px);border:1px solid var(--rule);border-radius:18px;background:rgba(255,253,248,.45);text-align:center}
.lp-designed .lp-sec--why .lp-eyebrow{margin-bottom:10px}

@media (max-width:820px){
  .lp-value-grid{grid-template-columns:1fr}
  .lp-designed .lp-rows .lp-sec,.lp-designed .lp-rows .lp-sec:nth-child(even){grid-template-columns:1fr}
}
@media (max-width:480px){.lp-value{grid-template-columns:84px 1fr}}

/* value cards and the "Why" block sit on the page colour so the illustrations show no tile edge */
.lp-designed .lp-value,.lp-designed .lp-sec--why{background:transparent}
/* imported lead paragraphs tagged <h4> read as body text at the same weight */
.lp-designed :is(.lp-value,.lp-sec) h4{font:400 16.5px/1.65 -apple-system,BlinkMacSystemFont,"Inter","Segoe UI",sans-serif;color:var(--body);margin:0 0 .7em}
.lp-designed .lp-value h4{font-size:15.5px;line-height:1.6}
.lp-designed .lp-sec-text .lp-eyebrow{margin:0 0 10px;font:500 11px/1 -apple-system,BlinkMacSystemFont,"Inter",sans-serif;letter-spacing:.18em;color:var(--muted)}
.lp-designed .lp-more{text-align:left}.lp-designed .lp-sec--why .lp-more{text-align:center}
@media (max-width:600px){.lp-value{grid-template-columns:1fr;gap:14px}.lp-value-img{max-width:150px}}
/* wide app screenshots (connections): text above, screenshot across the row */
.lp-designed .lp-rows .lp-sec--wide,.lp-designed .lp-rows .lp-sec--wide:nth-child(even){grid-template-columns:1fr;max-width:900px;margin:0 auto;text-align:center;gap:24px}
.lp-designed .lp-sec--wide .lp-sec-text{order:0;max-width:62ch;margin:0 auto}
.lp-designed .lp-sec--wide .cms-sec-img img{max-width:100%;max-height:none}
/* library previews: three across, compact */
.lp-designed .cms-sec--shots .cms-sec-img{grid-template-columns:repeat(3,minmax(0,240px));justify-content:center;gap:18px}
@media (max-width:600px){.lp-designed .cms-sec--shots .cms-sec-img{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lp-designed .lp-sec--noimg .lp-more{text-align:center}