/* Project stories and working concepts. Uses Cala's shared theme and type. */
[hidden]{display:none!important}
.case-nav{border-bottom:0}
.case-nav .text-link,.text-link{display:inline-flex;align-items:center;gap:1rem;min-height:2.75rem;text-decoration:underline;text-underline-offset:.3em;font-size:var(--type-label);text-decoration-skip-ink:auto}
.case-hero{padding-block:4rem 3.5rem}
.case-heading{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;gap:3rem;margin-block:1rem 3rem}
.case-heading h1{font-size:clamp(3rem,7vw,7rem);font-weight:450;letter-spacing:-.06em;line-height:1.08;margin:0}
.case-heading p{font-size:1.125rem;max-width:39ch;color:var(--muted);margin:0}
.case-facts{display:flex;flex-wrap:wrap;gap:1.5rem 4rem;margin:0}
.case-facts dt{font-size:var(--type-meta);color:var(--muted);margin-block-end:.25rem}
.case-facts dd{font-size:var(--type-label);margin:0}
.case-image{margin:0;position:relative}
.case-image img{aspect-ratio:16/8;object-fit:cover;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px}
.case-image.alder-image img{object-position:center 43%}
.case-image>figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem 2rem;padding-block:1rem;font-size:var(--type-meta);color:var(--muted)}
.case-section{padding-block:5rem;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:4rem}
.case-section h2{font-size:clamp(1.875rem,3vw,2.75rem);font-weight:450;line-height:1.2;letter-spacing:-.04em;margin:0}
.case-section p{margin-block:0 1.25rem;max-width:63ch;color:var(--muted)}
.case-section .lead{color:var(--ink);font-size:clamp(1.25rem,2vw,1.625rem);line-height:1.5}
.design-decisions{display:grid;gap:2rem}
.design-decisions article{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:1rem}
.design-decisions .decision-num{color:var(--muted);font-size:var(--type-meta);font-variant-numeric:tabular-nums;padding-block-start:.4rem}
.design-decisions h3{font-weight:500;font-size:1.25rem;margin:0 0 .5rem}
.design-decisions p{margin:0}
.case-tags{display:flex;flex-wrap:wrap;gap:.625rem;margin-block:1.5rem}
.case-tags span{border:1px solid var(--line);padding:.5rem .875rem;border-radius:2rem;font-size:var(--type-meta)}
.case-next{padding-block:4rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem}
.case-next h2{font-size:clamp(1.75rem,4vw,3rem);font-weight:450;letter-spacing:-.04em;margin:.5rem 0}
.case-contact{padding-block:4rem;border-top:1px solid var(--line)}
.case-contact h2{font-size:clamp(2rem,4vw,3.25rem);font-weight:450;line-height:1.15;letter-spacing:-.045em;margin:0 0 1.5rem}
.case-contact p{max-width:55ch;color:var(--muted)}
.concept-banner-links{display:flex;flex-wrap:wrap;gap:1.5rem}
.concept-banner-links a{min-height:2.75rem;align-items:center;display:inline-flex;text-decoration:underline;text-underline-offset:.25em}
.alder-page{--panel:#e2e5d9;--panel-ink:#263729;--filter-fill:#263729;--filter-ink:#efeee5}
.form-page{--panel:#303236;--panel-ink:#f0f0eb;--accent-fill:#d3e5b3;--accent-ink:#25272a}
.concept-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:4.5rem}
.concept-hero h1{font-size:clamp(3rem,6vw,6.625rem);line-height:1.07;letter-spacing:-.06em;font-weight:450;margin:1.5rem 0}
.alder-page .concept-hero h1{font-family:Georgia,serif;font-weight:400;letter-spacing:-.045em}
.concept-hero p{max-width:38ch;font-size:1.125rem;color:var(--muted);margin-block-end:2rem}
.hero-photo{margin:0;min-width:0}
.hero-photo img{aspect-ratio:4/5;max-height:42rem;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px}
.alder-page .hero-photo img{outline-color:rgb(0 0 0 / .1)}
.hero-photo figcaption{margin-block-start:.75rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem;font-size:var(--type-meta);color:var(--muted)}
.concept-strip{border-block:1px solid var(--line);padding-block:1.25rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem 2rem;font-size:var(--type-label);color:var(--muted)}
.alder-page .section-head h2,.alder-page .editorial-note h2{font-family:Georgia,serif;letter-spacing:-.035em}
.journal-tools{margin-block:0 1.5rem}
.filter-group{display:flex;flex-wrap:wrap;gap:.75rem;margin-block-end:1rem}
.filter-button{font:inherit;font-size:var(--type-label);color:var(--ink);background:transparent;border:1px solid var(--control-border);border-radius:2rem;min-height:2.75rem;padding:.625rem 1.125rem;cursor:pointer}
.filter-button[aria-pressed=true]{color:var(--filter-ink);background:var(--filter-fill)}
.filter-status{font-size:var(--type-meta);color:var(--muted);margin:0}
.journal-story{padding:0}
.journal-story summary{padding-block:1.75rem;min-height:2.75rem}
.story-meta{display:inline-block;color:var(--muted);font-family:Inter,Arial,sans-serif;font-size:var(--type-meta);font-weight:400;letter-spacing:0;line-height:1.5;margin-inline-start:.5rem}
.story-title{font-family:Georgia,serif;font-size:clamp(1.5rem,2.75vw,2.5rem);line-height:1.25}
.story-body{padding:0 1.5rem 2rem;max-width:72ch}
.story-body p{margin-block:0 1.25rem;font-size:1.0625rem;line-height:1.65}
.story-body .story-exercise{padding:1.25rem;background:var(--panel);color:var(--panel-ink);margin-block-start:1.75rem}
.editorial-note{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:center;padding-block:5rem}
.editorial-note figure{margin:0}
.editorial-note img{aspect-ratio:4/3;outline:1px solid rgb(0 0 0 / .1);outline-offset:-1px}
.editorial-note h2{font-size:clamp(2rem,4vw,3.5rem);font-weight:400;line-height:1.2;margin:1rem 0 1.5rem}
.editorial-note p{max-width:42ch;color:var(--muted);font-size:1.0625rem}
.concept-end{padding-block:3rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem}
.concept-end p{max-width:48ch;color:var(--muted);margin-block:0 .5rem}
.concept-end h2{font-size:1.5rem;font-weight:500;margin:0 0 .75rem}
.detail-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.detail-service{display:flex;flex-direction:column;align-items:flex-start;min-width:0;border-top:1px solid var(--line);padding-block:1.5rem 0}
.detail-service h3{font-size:1.5rem;font-weight:450;margin:1rem 0}
.detail-service p{margin:0 0 1rem;color:var(--muted)}
.detail-service ul{padding-inline-start:1.25rem;color:var(--muted);margin-block:0 1.5rem}
.detail-service li+li{margin-block-start:.5rem}
.detail-service .text-link{margin-block-start:auto}
.detail-builder{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem}
.detail-builder fieldset{border:0;padding:0;margin:0 0 2rem;min-width:0}
.detail-builder legend,.field-label{display:block;font-size:1rem;font-weight:500;margin-block-end:1rem}
.service-options{display:grid;gap:.75rem}
.service-option{display:flex;align-items:center;gap:1rem;min-height:3.5rem;border:1px solid var(--control-border);padding:.875rem 1rem;cursor:pointer}
.service-option:has(input:checked){border-color:var(--accent-fill);border-width:2px;padding:calc(.875rem - 1px) calc(1rem - 1px)}
.service-option input{width:1.25rem;height:1.25rem;flex:none;accent-color:var(--accent-fill);margin:0}
.service-option:focus-within{outline:2px solid var(--focus-ring);outline-offset:4px}
.service-option strong{font-weight:500}
.service-option span{display:block;font-size:var(--type-label);color:var(--muted)}
.service-option small{margin-inline-start:auto;font-size:var(--type-meta);color:var(--accent-fill)}
.detail-builder select{font:inherit;font-size:1rem;width:100%;max-width:100%;padding:.875rem 2rem .875rem 1rem;min-height:3rem;background:var(--panel);color:var(--panel-ink);border:1px solid var(--control-border);border-radius:0}
.detail-builder select:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px}
.detail-summary{background:var(--panel);padding:clamp(1.5rem,3vw,2.5rem);align-self:start}
.detail-summary h3{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:450;letter-spacing:-.04em;margin:1rem 0 .5rem;line-height:1.2}
.detail-summary p{color:var(--muted);margin-block:.5rem 1.25rem}
.detail-summary ul{list-style:none;padding:0;margin:1.5rem 0}
.detail-summary li{display:flex;gap:.75rem;padding-block:.5rem}
.detail-summary .selection-note{font-size:var(--type-meta);padding-block-start:1rem;border-top:1px solid var(--line);margin-block-end:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.project-meta .project-summary{max-width:43ch;font-size:var(--type-label);line-height:1.6;margin-block-start:.75rem}
.form-preview-photo{position:relative;overflow:hidden;aspect-ratio:2/1;margin-block-start:1.5rem;min-height:8rem}
.form-preview-photo img{object-position:center;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px}
.form-preview .form-inner h3{margin-block:1.75rem 1rem;font-size:clamp(2rem,3vw,3rem)}
@media(hover:hover){.filter-button:hover{outline:1px solid var(--ink);outline-offset:2px}.service-option:hover{background:var(--panel)}.text-link:hover{text-decoration-thickness:2px}}
@media(max-width:60rem){.case-heading,.case-section,.concept-hero,.editorial-note{grid-template-columns:minmax(0,1fr);gap:2rem}.case-heading p{max-width:52ch}.concept-hero h1{font-size:clamp(3rem,9vw,5rem)}.hero-photo img{aspect-ratio:5/4;max-height:35rem}.concept-hero{padding-block:3rem}.detail-services{grid-template-columns:minmax(0,1fr)}.detail-service{display:block}.detail-builder{grid-template-columns:minmax(0,1fr);gap:1rem}.case-section,.editorial-note{padding-block:3rem}.case-hero{padding-block:2rem}.case-image img{aspect-ratio:5/4}}
@media(max-width:30rem){.case-heading h1{font-size:3rem}.case-facts{gap:1.5rem 2rem}.story-meta{display:block;margin:.75rem 0 0 1.25rem}.story-body{padding-inline:0}.service-option{flex-wrap:wrap}.service-option small{margin-inline-start:2.25rem}.concept-banner-links{gap:.75rem 1.25rem}}
@media(forced-colors:active){.filter-button[aria-pressed=true]{border:2px solid Highlight}.service-option:has(input:checked){border-color:Highlight}.service-option small{color:CanvasText}.detail-builder select:focus-visible,.service-option:focus-within{outline-color:Highlight}}
