/* Three separate beats: a concrete argument, the first image, the full story. */

#promise .section-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:var(--s-64);align-items:center}
.argument-intro{display:flex;flex-direction:column;gap:var(--s-20);min-width:0}
.argument-intro h2{font-size:clamp(32px,3.2vw,44px);line-height:1.12;max-width:20ch;text-wrap:pretty}
.argument-intro>p{font-size:19px;line-height:1.6;color:var(--ink-muted);max-width:39ch}
.argument-intro .argument-approval{font-size:16px;color:var(--ink-faint);padding:var(--s-12) var(--s-20);border:1px solid var(--line);border-radius:9px;max-width:none}
.argument-specimen{min-width:0;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}
.argument-specimen figcaption{display:flex;align-items:center;justify-content:flex-start;gap:var(--s-20);padding:var(--s-20) var(--s-20);font-size:15px;color:var(--ink-muted)}
.argument-sheet-number{font:600 42px/1 var(--display-font);letter-spacing:-.05em;color:var(--ink-faint)}

.argument-chain>div{display:grid;grid-template-columns:108px minmax(0,1fr);gap:var(--s-20);align-items:baseline;padding:var(--s-20) var(--s-20);border-top:1px solid var(--line)}
.argument-chain dt{font-size:14px;line-height:1.5;color:var(--ink-muted)}
.argument-chain dd{font:600 23px/1.3 var(--display-font);letter-spacing:-.012em}
.argument-chain>div:last-child{background:var(--accent-soft)}
.argument-chain>div:last-child dt{color:var(--accent)}
.argument-note{font-size:12px;line-height:1.5;color:var(--ink-muted);padding:var(--s-20) var(--s-20);max-width:none}


#thumbnail .section-grid{position:relative;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:var(--s-64);background:#dce5df;color:#182d21;border-radius:20px;align-items:center}
#thumbnail .thumbnail-text{display:flex;flex-direction:column;gap:var(--s-20);grid-column:auto;min-width:0}
#thumbnail .thumbnail-label{font-size:13px;line-height:1.5;font-weight:500;color:#46604f}
#thumbnail h2{font-size:clamp(30px,3.2vw,42px);line-height:1.12;max-width:20ch;text-wrap:pretty}
#thumbnail .thumbnail-text>p{font-size:19px;line-height:1.55;max-width:40ch;color:#385241}
#thumbnail .thumbnail-text .thumbnail-detail{font-size:16px;line-height:1.5;color:#182d21}
#thumbnail .thumbnail-text p:not(.eyebrow){color:#385241}
#thumbnail .thumbnail-text p.thumbnail-label{font-size:13px;color:#46604f}
#thumbnail .thumbnail-text p.thumbnail-detail{font-size:16px;color:#182d21}
#thumbnail .thumbnail-visual{grid-column:auto;display:flex;flex-direction:column;align-items:center;justify-self:end;width:100%;max-width:340px;background:#fff;border-radius:14px;padding:var(--s-20);gap:var(--s-8);min-width:0}
.thumbnail-canvas{width:100%;height:270px;display:grid;place-items:center}
#thumbnail .thumbnail-visual img{width:207.2px;max-width:100%;height:auto;transition:width 220ms ease}
#thumbnail .thumbnail-visual[data-scale=search] img{width:112px}
#thumbnail .thumbnail-visual figcaption{font-size:13px;line-height:1.5;color:#46604f;text-align:center;padding-bottom:var(--s-4)}
.thumbnail-scale{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:300px;padding:var(--s-4);border:1px solid #a7bcae;border-radius:14px;gap:var(--s-4)}
.thumbnail-scale button{font:500 14px/1.3 var(--body-font);color:#182d21;min-height:44px;padding:var(--s-8) var(--s-12);border-radius:10px;transition:background-color 160ms,color 160ms}
.thumbnail-scale button[aria-pressed=true]{background:#182d21;color:#f4f6f2}
.thumbnail-scale button:hover:not([aria-pressed=true]){background:#c3d5c9}
.thumbnail-scale button:focus-visible{outline-color:#182d21}


#amoria .section-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--s-40) var(--s-40);align-items:end}
#amoria .case-intro-heading{grid-column:1/8;gap:var(--s-12)}
#amoria .case-intro-heading h2{font-size:clamp(32px,3.4vw,44px);line-height:1.12;max-width:22ch;text-wrap:pretty}
#amoria .case-intro-heading .eyebrow{font-size:12px;letter-spacing:.06em}
#amoria .case-intro-summary{grid-column:8/13;padding-bottom:var(--s-4)}
#amoria .case-intro-summary p{font-size:18px;line-height:1.6;max-width:none}
.case-index{grid-column:1/-1;min-width:0}
.case-index ol{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s-20);padding:0;list-style:none}
.case-index li{min-width:0;max-width:none}
.case-index a{display:block;min-width:0;border-radius:8px;text-decoration:none}
.case-index-art{display:block;overflow:hidden;border-radius:8px;background:var(--surface);transition:box-shadow 180ms}
.case-index-art img{width:100%;aspect-ratio:1;object-fit:contain}
.case-index-caption{display:flex;flex-direction:column;gap:var(--s-2);padding-top:var(--s-12);font:600 20px/1.3 var(--display-font)}
.case-index-number{font:400 12px/1.5 var(--body-font);color:var(--ink-faint)}
.case-index a:hover .case-index-art{box-shadow:0 0 0 2px var(--ink-faint)}
.case-index a:hover .case-index-caption{color:var(--ink-faint)}

/* The bot is the recommended entry; personal contact is the alternative. */
#contact .contact-kicker{color:var(--ink-faint)}
#contact .contact-person-label{color:var(--ink-muted)}
.contact-questions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-12);list-style:none;padding:0;margin-inline:0}
.contact-questions li{display:flex;flex-direction:column;gap:var(--s-4);padding-top:var(--s-12);border-top:1px solid var(--line);font-size:16px;line-height:1.5}
.contact-questions li>span:first-child{font-size:12px;line-height:1.4;color:var(--ink-faint)}
#contact .contact-direct-button{min-height:60px;color:var(--ink-muted);border-color:var(--line);background:transparent}
#contact .contact-direct-button:hover{color:var(--ink);border-color:var(--ink-muted);background:var(--surface-raised)}

@media(min-width:640px) and (max-width:1023px){

 #promise .section-grid{gap:var(--s-40);grid-template-columns:minmax(0,1fr)}.argument-intro{max-width:none;gap:var(--s-20)}.argument-intro h2{max-width:none}.argument-intro>p{max-width:50ch}.argument-intro .argument-approval{max-width:420px}
 .argument-chain>div{grid-template-columns:140px minmax(0,1fr)}
 #thumbnail .section-grid{gap:var(--s-40);grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}#thumbnail h2{font-size:32px}#thumbnail .thumbnail-text>p{font-size:17px}#thumbnail .thumbnail-visual{padding:var(--s-12)}.thumbnail-canvas{height:244px}
 #amoria .section-grid{gap:var(--s-20)}#amoria .case-intro-heading{grid-column:1/8}#amoria .case-intro-summary{grid-column:8/13}.case-index ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-20)}.case-index-art{max-width:none}
}
@media(max-width:639px){
#promise .section-grid{grid-template-columns:minmax(0,1fr);gap:var(--s-20)}.argument-intro{gap:var(--s-20)}.argument-intro h2{font-size:34px;max-width:none}.argument-intro>p{font-size:18px;line-height:1.55}.argument-intro .argument-approval{font-size:15px;padding:var(--s-12) var(--s-12)}
 .argument-specimen figcaption{padding:var(--s-20)}.argument-sheet-number{font-size:36px}.argument-chain>div{grid-template-columns:minmax(0,1fr);gap:var(--s-8);padding:var(--s-20)}.argument-chain dt{font-size:13px}.argument-chain dd{font-size:23px}.argument-note{padding:var(--s-12) var(--s-20);font-size:12px}
#thumbnail .section-grid{grid-template-columns:minmax(0,1fr);gap:var(--s-20);border-radius:16px}#thumbnail .thumbnail-text{gap:var(--s-20)}#thumbnail h2{font-size:31px;max-width:none}#thumbnail .thumbnail-text>p{font-size:17px}#thumbnail .thumbnail-text .thumbnail-detail{font-size:15px}.thumbnail-scale{max-width:none}#thumbnail .thumbnail-visual{justify-self:center;max-width:none;padding:var(--s-12)}.thumbnail-canvas{height:224px}
#amoria .section-grid{grid-template-columns:minmax(0,1fr);gap:var(--s-20)}#amoria .case-intro-heading,#amoria .case-intro-summary{grid-column:1}#amoria .case-intro-heading h2{font-size:34px;max-width:none}#amoria .case-intro-summary p{font-size:17px}.case-index ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-20) var(--s-12)}.case-index-caption{font-size:16px;padding-top:var(--s-8)}.case-index-number{font-size:11px}
 #contact .contact-invitation h2{font-size:34px}.contact-questions{gap:var(--s-12)}.contact-questions li{font-size:15px}
}
@media(max-width:359px){#thumbnail h2{font-size:29px}#thumbnail .thumbnail-visual{padding:var(--s-12)}.thumbnail-canvas{height:208px}.case-index ol{gap:var(--s-20) var(--s-8)}.case-index-caption{font-size:14px}#contact .contact-invitation h2{font-size:31px}}
@media(prefers-reduced-motion:reduce){#thumbnail .thumbnail-visual img,.thumbnail-scale button,.case-index-art{transition:none}}