/* Spire: focused concept page. Existing brand, local assets, no external services. */
.sp-page h1,.sp-page h2,.sp-page h3{font-family:var(--display);letter-spacing:-.045em;line-height:1.08}
.sp-page h1{font-size:clamp(2.6rem,4.8vw,4.6rem);max-width:15ch}
.sp-page h2{font-size:clamp(2rem,3.3vw,3.25rem);max-width:23ch}
.sp-page p{line-height:1.6}
.sp-page .lead{font-size:1.15rem;max-width:46ch;margin-top:24px}
.sp-intro h1{margin-top:24px}
.sp-intro{padding:85px 0 70px}
.sp-intro-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:60px;align-items:center}
.sp-portrait{margin:0;text-align:center;position:relative}
.sp-portrait img{width:min(100%,340px);height:auto;display:block;margin:auto;filter:drop-shadow(0 18px 15px #25291c12)}
/* Talebobbel: Spires hilsen står i en boble ved siden af ham, ikke som billedtekst under ham */
.sp-portrait figcaption{position:absolute;top:2%;right:-2%;width:max-content;max-width:210px;margin:0;padding:12px 16px;text-align:left;font-size:1.05rem;line-height:1.35;color:var(--ink);background:var(--panel);border-radius:20px 20px 20px 6px;box-shadow:0 0 0 1px var(--line),0 12px 26px -14px rgba(29,31,26,.4)}
.sp-portrait figcaption::after{content:"";position:absolute;left:24px;bottom:-14px;border:14px solid transparent;border-top-color:var(--panel);border-bottom:0;filter:drop-shadow(0 1px 0 var(--line))}
.sp-caption{font-size:.85rem;color:var(--quiet);margin-top:20px}
.sp-examples{background:var(--band);padding:70px 0}
.sp-section-head p:last-child{margin-top:16px;color:var(--ink-2)}
.sp-demo{margin-top:30px}
.sp-chooser{border:0;padding:0;margin:0 0 20px;min-width:0}
.sp-ch-row{display:flex;gap:10px;flex-wrap:wrap}
.sp-ch{position:relative;cursor:pointer}
.sp-ch input{position:absolute;opacity:0;width:1px;height:1px}
.sp-ch span{display:block;border:1px solid var(--line);border-radius:99px;padding:12px 22px;font-size:.95rem;background:transparent;transition:background .15s}
.sp-ch input:checked+span{background:var(--ink);color:var(--canvas);border-color:var(--ink)}
.sp-ch input:focus-visible+span{outline:3px solid var(--thread-cta);outline-offset:3px}
.sp-demo.sp-ready .sp-case{display:none}
.sp-demo.sp-ready .sp-case.is-on{display:block}
.sp-case+.sp-case{margin-top:30px}
.sp-demo.sp-ready .sp-case+.sp-case{margin-top:0}
.sp-demo-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:start;background:var(--panel);border-radius:24px;padding:36px}
.sp-label{font-size:.75rem;font-weight:600;color:var(--quiet);margin-bottom:12px;text-transform:uppercase;letter-spacing:.08em}
.sp-dialog h3{font-size:clamp(1.5rem,2.2vw,2.1rem);max-width:23ch}
.sp-answer{border-left:2px solid var(--thread-cta);padding-left:18px;margin-top:24px}
.sp-answer p:last-child{font-size:1rem;color:var(--ink-2)}
.sp-dialog img{display:block;width:140px;height:auto;margin:20px 0 -15px 12px}
.sp-result{border:1px solid var(--line);border-radius:16px;padding:24px;min-width:0;background:var(--canvas);min-height:380px}
.sp-result-head{display:flex;gap:12px;flex-wrap:wrap;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:22px;font-weight:600}
.sp-result-head small{font-size:.72rem;color:var(--quiet);font-weight:400}
.sp-metrics{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:25px}
.sp-metrics strong{display:block;font:500 2.5rem var(--display);line-height:1.2}
.sp-metrics span{font-size:.8rem;color:var(--ink-2)}
.sp-result h4{font-size:.9rem;font-weight:600;margin-bottom:12px}
.sp-results{list-style:none;margin:0;padding:0}
.sp-results li{padding:14px 0;border-top:1px solid var(--line)}
.sp-results b,.sp-results span{display:block;font-size:.9rem;line-height:1.45}
.sp-results span{color:var(--ink-2);margin-top:3px}
.sp-results em{display:inline-block;margin-top:8px;color:#735515;font-style:normal;font-size:.72rem;background:#eee6d4;padding:3px 8px;border-radius:5px}
.sp-result-note{font-size:.8rem;color:var(--quiet);margin-top:20px}
.sp-demo-note{font-size:.8rem;color:var(--quiet);margin-top:18px}
.sp-result .sp-task-title{font:600 1.55rem/1.2 var(--display);letter-spacing:-.025em;margin-bottom:18px}
.sp-task-state{padding:12px 0;border-block:1px solid var(--line);margin-top:25px;font-size:.9rem;color:var(--ink-2)}
.sp-guidance{padding:85px 0}
.sp-guidance-grid{display:grid;grid-template-columns:.6fr 1.4fr;gap:70px;align-items:center}
.sp-guidance figure{margin:0}
.sp-guidance img{width:100%;max-width:230px;height:auto;display:block;margin:auto;filter:drop-shadow(0 15px 18px #25291c12)}
.sp-principles{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:32px;border-top:1px solid var(--line);padding-top:25px}
.sp-principles h3{font-size:1.2rem;letter-spacing:-.02em;margin-bottom:12px}
.sp-principles p{font-size:.95rem;color:var(--ink-2)}
.sp-finish{padding:65px 0;background:var(--band)}
.sp-finish-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.sp-finish h2{margin-bottom:18px}
.sp-account{border-left:1px solid var(--line);padding-left:40px}
.sp-account h3{font-size:1.5rem;margin-bottom:16px}
.sp-account p{font-size:.95rem;color:var(--ink-2)}
.sp-account details{margin:18px 0;font-size:.95rem}
.sp-account summary{cursor:pointer;padding:10px 0;font-weight:500}
.sp-account details p{margin:8px 0 18px}
.sp-page a:focus-visible,.sp-page summary:focus-visible{outline:3px solid var(--thread-cta);outline-offset:4px}
@media(max-width:760px){.sp-intro{padding:100px 0 48px}.sp-intro-grid{gap:20px;grid-template-columns:1fr}.sp-page h1{max-width:18ch}.sp-portrait img{width:200px}.sp-portrait{display:flex;align-items:center;justify-content:center;gap:18px}.sp-portrait figcaption{position:relative;top:auto;right:auto;max-width:170px;font-size:1rem;border-radius:20px 20px 20px 6px;margin-top:-40px}.sp-portrait figcaption::after{left:-11px;bottom:auto;top:44px;border:11px solid transparent;border-left:0;border-right-color:var(--panel)}.sp-demo-grid{grid-template-columns:1fr;gap:24px;padding:24px}.sp-dialog{position:relative;padding-right:65px}.sp-dialog img{position:absolute;right:-10px;bottom:0;width:75px;margin:0}.sp-answer{margin-top:20px}.sp-result{min-height:0;padding:20px}.sp-guidance-grid{grid-template-columns:1fr;gap:25px}.sp-guidance figure{order:2}.sp-guidance img{max-width:130px}.sp-principles{gap:22px}.sp-finish-grid{grid-template-columns:1fr;gap:32px}.sp-account{border-left:0;border-top:1px solid var(--line);padding:25px 0 0}.sp-examples,.sp-guidance,.sp-finish{padding:48px 0}.sp-ch span{padding:12px 14px;font-size:.85rem}.sp-ch-row{gap:8px}}
@media(max-width:390px){.sp-principles{grid-template-columns:1fr}.sp-demo-grid{padding:18px}.sp-ch span{padding:11px;font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.sp-page *{transition:none!important;animation:none!important}}

/* små situationsfigurer i afslutningen */
.sp-mini{display:block;width:150px;height:auto;margin:22px 0 0;filter:drop-shadow(0 12px 16px rgba(29,31,26,.18))}
.sp-mini-r{float:right;margin:0 0 8px 16px}
@media(max-width:760px){.sp-mini{width:120px}}
