/* Focused landing pages, sharing the NOCTURNE palette and navigation. */
.landing-content { --lp-border:rgba(239,241,225,.15); }
.landing-content .lp-hero { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:3vw; padding-top:40px; padding-bottom:48px; min-height:620px; }
.landing-content .lp-breadcrumb { display:flex; gap:10px; flex-wrap:wrap; margin:0 0 35px; color:var(--muted); font-size:12px; }
.landing-content .lp-breadcrumb a { text-decoration:underline; text-underline-offset:4px; }
.landing-content .lp-hero h1 { font-weight:400; font-size:clamp(44px,5.7vw,86px); line-height:1.04; letter-spacing:-.055em; margin:16px 0 25px; }
.landing-content .lp-hero h1 em { color:var(--accent); font-style:normal; }
.landing-content .lp-lead { max-width:550px; font-size:17px; line-height:1.75; color:var(--muted); }
.landing-content .lp-actions { display:flex; gap:22px; flex-wrap:wrap; align-items:center; margin:28px 0; }
.landing-content .lp-actions .button { min-height:48px; }
.landing-content .lp-tags { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:22px 0 0; }
.landing-content .lp-tags li { border:1px solid var(--lp-border); border-radius:100px; padding:8px 12px; font-size:11px; color:var(--muted); }
.landing-content .lp-art { position:relative; min-width:0; margin:0; }
.landing-content .lp-photo-stage { height:470px; position:relative; overflow:hidden; }
.landing-content .lp-photo-stage:before { content:""; position:absolute; inset:12%; background:radial-gradient(ellipse,rgba(218,173,94,.14),transparent 70%); }
.landing-content .lp-photo-stage img { position:absolute; width:175%; max-width:none; height:100%; object-fit:contain; left:-47%; top:0; }
.landing-content .lp-art figcaption { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:16px 0; border-top:1px solid var(--lp-border); color:var(--muted); font-size:11px; line-height:1.5; }
.landing-content .lp-art .light-switch { border:1px solid var(--lp-border); padding:12px 16px; min-height:44px; border-radius:30px; }
.landing-content .lp-jumpnav { display:flex; flex-wrap:wrap; gap:10px 26px; border-block:1px solid var(--lp-border); padding-block:19px; font-size:13px; }
.landing-content .lp-jumpnav a { padding-block:8px; color:var(--muted); }
.landing-content .lp-jumpnav a:hover { color:var(--accent); }
.landing-content .lp-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px; padding-top:48px; padding-bottom:55px; }
.landing-content .lp-benefit { border-left:1px solid var(--lp-border); padding-left:22px; }
.landing-content .lp-benefit h2 { font-size:21px; line-height:1.3; letter-spacing:-.02em; margin:0 0 12px; }
.landing-content .lp-benefit p,.landing-content .lp-steps p { color:var(--muted); font-size:14px; line-height:1.8; }
.landing-content .lp-section { padding-block:65px; border-bottom:1px solid var(--lp-border); scroll-margin-top:24px; }
.landing-content .lp-section h2 { font-size:clamp(30px,3.3vw,49px); letter-spacing:-.045em; line-height:1.13; margin:15px 0 28px; }
.landing-content .lp-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:25px; list-style:none; padding:0; margin:35px 0 0; }
.landing-content .lp-step-number { font-size:40px; font-weight:300; color:var(--accent); opacity:.75; }
.landing-content .lp-steps h3 { font-size:20px; line-height:1.3; margin:20px 0 12px; }
.landing-content .lp-editorial { display:grid; grid-template-columns:.85fr 1.15fr; gap:7vw; }
.landing-content .lp-editorial .lp-prose { padding-top:5px; max-width:720px; }
.landing-content .lp-prose p { font-size:16px; color:var(--muted); line-height:1.85; margin:0 0 20px; }
.landing-content .lp-prose a { color:var(--accent); text-decoration:underline; text-underline-offset:4px; }
.landing-content .lp-note { border-left:2px solid var(--accent); padding:20px 24px; margin:28px 0 0; background:rgba(220,246,140,.04); font-size:14px; line-height:1.8; color:var(--muted); }
.landing-content .lp-note strong { color:var(--ink); }
.landing-content .lp-faq { display:grid; grid-template-columns:.7fr 1.3fr; gap:7vw; }
.landing-content .lp-faq details { border-bottom:1px solid var(--lp-border); padding:20px 0; }
.landing-content .lp-faq summary { list-style:none; cursor:pointer; display:flex; gap:18px; justify-content:space-between; font-size:17px; line-height:1.5; }
.landing-content .lp-faq summary::-webkit-details-marker { display:none; }
.landing-content .lp-faq summary:after { content:"+"; flex:none; color:var(--accent); }
.landing-content .lp-faq details[open] summary:after { content:"−"; }
.landing-content .lp-faq details p { color:var(--muted); font-size:15px; line-height:1.8; margin:18px 24px 0 0; }
.landing-content .lp-related { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.landing-content .lp-related a { padding:28px; border:1px solid var(--lp-border); }
.landing-content .lp-related h3 { font-size:25px; line-height:1.3; margin:12px 0; }
.landing-content .lp-related p { color:var(--muted); font-size:14px; line-height:1.7; }
.landing-content .lp-closing { padding-block:72px; text-align:center; }
.landing-content .lp-closing h2 { font-size:clamp(35px,4.5vw,65px); letter-spacing:-.045em; line-height:1.1; max-width:750px; margin:18px auto; }
.landing-content .lp-closing p { color:var(--muted); margin:20px auto 28px; max-width:620px; line-height:1.7; }
.landing-content .lp-source { font-size:13px; line-height:1.8; color:var(--muted); margin:24px 0; }
.landing-content .lp-source a { text-decoration:underline; text-underline-offset:4px; }
.landing-content .landing-generator { padding-block:0 55px; scroll-margin-top:30px; }
.landing-content .lp-generator-title { padding-block:40px 25px; }
.landing-content .lp-generator-title h2 { font-size:clamp(30px,3vw,45px); letter-spacing:-.04em; margin:12px 0; }
.landing-content .lp-generator-title p { color:var(--muted); line-height:1.7; max-width:650px; }
/* Keep primary actions above the fold on typical laptop displays. */
@media(min-width:761px) and (max-height:820px) {
 .landing-content .lp-hero { padding-top:25px; min-height:570px; }
 .landing-content .lp-breadcrumb { margin-bottom:24px; }
 .landing-content .lp-hero h1 { font-size:clamp(44px,4.7vw,64px); margin-bottom:20px; }
 .landing-content .lp-lead { font-size:16px; line-height:1.65; }
 .landing-content .lp-actions { margin-block:22px; }
}
/* Code-drawn explanatory illustrations: no printer or print result is promised. */
.landing-content .lp-color-stage { position:relative; min-height:460px; display:grid; place-items:center; perspective:1000px; isolation:isolate; }
.landing-content .lp-color-stage:before { content:""; position:absolute; inset:10%; z-index:-1; background:radial-gradient(ellipse,rgba(217,143,90,.2),transparent 70%); }
.landing-content .lp-layer { width:65%; aspect-ratio:4/3; position:absolute; border:1px solid rgba(255,255,255,.5); border-radius:5px; transform:rotateY(-23deg) rotateZ(-9deg); }
.landing-content .lp-layer-light { background:radial-gradient(ellipse,#fffce3,#ffe4ac); transform:translate(49px,-49px) rotateY(-23deg) rotateZ(-9deg); box-shadow:0 0 80px #e5bc6844; }
.landing-content .lp-layer-color { background:radial-gradient(circle at 72% 30%,#fff2ba 0 8%,transparent 9%),linear-gradient(172deg,transparent 52%,#b6b8df 53% 66%,#8e9aa4 67% 80%,#f8b5a0 81%),linear-gradient(#b6d0ff,#ffc3ab 70%,#d1f1df); transform:translate(0,0) rotateY(-23deg) rotateZ(-9deg); box-shadow:0 18px 40px #0006; }
.landing-content .lp-layer-relief { transform:translate(-49px,49px) rotateY(-23deg) rotateZ(-9deg); background:repeating-linear-gradient(0deg,rgba(255,246,212,.63) 0 1px,rgba(187,169,126,.28) 1px 3px); box-shadow:0 20px 45px #0004; }
.landing-content .lp-layer-labels { display:flex; justify-content:space-around; flex-wrap:wrap; gap:10px; font-size:11px; color:var(--accent); padding:0; list-style:none; }
.landing-content .lp-printer-stage { min-height:440px; display:grid; place-items:center; position:relative; padding:45px 25px; }
.landing-content .lp-printer { position:relative; width:90%; max-width:380px; height:310px; border:13px solid #454b3c; border-bottom-width:24px; border-radius:6px; background:linear-gradient(180deg,rgba(220,246,140,.03),transparent); }
.landing-content .lp-printer:before { content:""; position:absolute; top:20%; left:-10px; width:calc(100% + 20px); height:18px; background:#555f48; box-shadow:0 3px 0 #171d14; }
.landing-content .lp-nozzle { position:absolute; top:18%; left:58%; width:42px; height:37px; background:var(--accent); border-radius:4px 4px 15px 15px; z-index:2; }
.landing-content .lp-bed { position:absolute; bottom:14px; left:6%; width:88%; height:10px; background:#929782; box-shadow:0 7px 0 #373f30; }
.landing-content .lp-print { position:absolute; bottom:24px; left:22%; width:56%; height:145px; border:5px solid #ebdfbc; background:repeating-linear-gradient(0deg,transparent 0 2px,#ffffff33 2px 3px),linear-gradient(153deg,#f7edcf 0 43%,#c4b085 44% 60%,#a18a5d 61% 75%,#dbc495 76%); box-shadow:0 0 35px #dfbc6822; }
.landing-content .lp-printer-mark { position:absolute; bottom:0; left:0; right:0; text-align:center; color:var(--muted); font-size:11px; letter-spacing:.12em; }
.landing-content :focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
@media(min-width:1400px) { .landing-content .lp-hero { min-height:700px; } }
@media(max-width:1000px) { .landing-content .lp-hero { min-height:0; gap:12px; } .landing-content .lp-photo-stage { height:380px; } .landing-content .lp-color-stage { min-height:390px; } .landing-content .lp-steps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; } }
@media(max-width:760px) {
 .landing-content .lp-hero { grid-template-columns:1fr; padding-top:25px; padding-bottom:25px; gap:24px; }
 .landing-content .lp-breadcrumb { margin-bottom:25px; font-size:11px; }
 .landing-content .lp-hero h1 { font-size:clamp(40px,10.5vw,65px); }
 .landing-content .lp-lead { font-size:15px; line-height:1.75; }
 .landing-content .lp-photo-stage { height:340px; }
 .landing-content .lp-color-stage { min-height:330px; }
 .landing-content .lp-printer-stage { min-height:340px; padding:20px; }
 .landing-content .lp-printer { height:260px; }
 .landing-content .lp-print { height:125px; }
 .landing-content .lp-benefits,.landing-content .lp-editorial,.landing-content .lp-faq { grid-template-columns:1fr; gap:24px; }
 .landing-content .lp-benefits { padding-block:35px; }
 .landing-content .lp-section { padding-block:40px; }
 .landing-content .lp-section h2 { margin-top:10px; }
 .landing-content .lp-related { grid-template-columns:1fr; }
 .landing-content .lp-closing { padding-block:45px; }
 .landing-content .lp-jumpnav { gap:8px 20px; font-size:12px; }
}
@media(max-width:420px) { .landing-content .lp-steps { grid-template-columns:1fr; } .landing-content .lp-photo-stage { height:280px; } .landing-content .lp-layer { width:60%; } .landing-content .lp-color-stage { min-height:290px; } .landing-content .lp-hero h1 { font-size:40px; } }
