/* scene=lp. Fifty refinements to the existing approved components.
   Existing palette, artwork, content and motion hooks are retained. */

/* D01: unify the reading width across the main sections. */
body main .section-wrap{width:min(1200px,calc(100% - var(--gutter)*2))}
/* D02: consistent, responsive section rhythm. */
body main :is(#connections,#memory,#human,#conditions,#contact){padding-block:clamp(44px,4.5vw,64px)}
/* D03: readable, consistent section kickers. */
body #main :is([class].eyebrow,[class].lgp-kicker){font-size:12px;line-height:1.7;letter-spacing:.1em;color:#486859}
/* D04: consistent heading leading without changing the hero. */
body #main :is(#memory-title,#human-title,#conditions-title,#lgp-friends-title){line-height:1.35;letter-spacing:-.035em}
/* D05: natural Japanese paragraph wrapping and a comfortable measure. */
body #about .lgp-product-copy p{max-width:34em;line-height:2;line-break:strict;text-wrap:pretty}
/* D06: align desktop navigation with a usable hit area. */
body .ui-hmenu a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;padding-inline:10px}
/* D07: separate the sticky header with a soft, quiet edge. */
body .ui-hd{box-shadow:0 3px 18px #183f3408;border-bottom-color:#c5dcd1}
/* D08: one visible keyboard-focus treatment on existing controls. */
body :is(a,button,input,textarea,summary):focus-visible{outline:3px solid #246b54!important;outline-offset:4px!important}
/* D09: make the primary hover state clear without moving the control. */
body #top .ly-hero-copy>.content-button:hover{background:#234d3e;border-color:#234d3e;color:#fff;box-shadow:0 6px 18px #234d3e18}
/* D10: give the primary pressed state visible feedback, also with reduced motion. */
body #top .ly-hero-copy>.content-button:active{background:#173d30;box-shadow:inset 0 2px 5px #092b2d38}
/* D11: the opening phrase should remain readable on mobile. */
body #top .lgp-overline{font-size:13px;letter-spacing:.06em;line-height:1.8}
/* D12: tighten the relation between the promise and its explanation. */
body #top .lgp-lead{font-size:clamp(14px,1.25vw,18px);line-height:1.85;margin:18px auto 16px;max-width:38em}
/* D13: consultation is the primary action; search remains available. */
body #top .ly-hero-copy>.content-button{background:#315e4c;color:#fff;border-color:#315e4c;min-height:52px;padding:13px 24px;box-shadow:0 5px 16px #315e4c12}
/* D14: make the search secondary and more compact. */
body #hero-search-form{padding:20px;border-radius:22px;border:1px solid #d6e8df;background:#ffffffd9;margin-top:18px!important}
body #hero-search-form button{background:#edf7f1;color:#315e4c;border:1px solid #8db29e;box-shadow:none;min-height:48px}
/* D15: give the search prompt the same weight as other field labels. */
body #main #hero-search-form label{font-size:14px;line-height:1.7;margin-bottom:10px;letter-spacing:0}
/* D16: legible example shortcuts with a consistent link underline. */
body #main .ly-search-shortcuts a{font-size:13px;min-height:44px;padding-inline:5px;text-underline-offset:5px;text-decoration-thickness:1px}
/* D17: ground the existing character group with a quiet shared shadow. */
body #main #top .ly-ensemble{border-radius:46%;background-image:radial-gradient(ellipse at 50% 82%,#7fa7911a,transparent 62%);background-repeat:no-repeat}
/* D18: align the hero facts through a shared numeral scale. */
body #main #top .ly-facts strong{font-size:clamp(36px,3.1vw,44px);font-weight:800;line-height:1.15;font-variant-numeric:tabular-nums}
/* D19: quiet, consistent containment for the hero facts. */
body .ly-facts{border-color:#d4e5dd;border-radius:20px;box-shadow:0 4px 18px #315e4c05;padding:20px 32px}
/* D20: balance the definition with the character group at desktop widths. */
body #about .lgp-product-copy{align-self:center;padding-block:12px}
/* D21: match the product panel to the section grid. */
body #about.lgp-product{max-width:1200px;padding:36px;gap:24px 36px;border-radius:26px}
/* D22: make the product heading larger, with less cramped tracking. */
body #main #about .lgp-product-heading h2{font-size:clamp(28px,3vw,40px);line-height:1.45;letter-spacing:-.03em;margin-top:12px}
/* D23: readable environment and version pills. */
body #about .lgp-product-tags :is(span,a){font-size:12px;line-height:1.6;padding:10px 14px;min-height:44px;border-color:#bfd8cb}
/* D24: unify outcome titles across the three examples. */
body #about .li-outcome>strong{font-size:20px;line-height:1.5;letter-spacing:-.02em;margin-top:4px}
/* D25: make the whole outcome footer a comfortable destination. */
body #about .li-see{min-height:44px;align-items:center;font-size:14px;border-top:1px solid #dce9e2;padding-top:12px;margin-top:auto}
/* D26: bind the showcase title to its work selector. */
body #connections .section-heading{margin-bottom:28px}
/* D27: a clear native choice, preserving radios and their keyboard behavior. */
body #connections .la-option{min-height:48px;font-size:14px;padding:11px 24px;border-color:#a3c3b4}
body #connections .la-option:has(input:checked){background:#315e4c;color:#fff;border-color:#315e4c}
body #connections .la-option input{accent-color:#315e4c}
body #connections .la-option:has(input:focus-visible){outline:3px solid #246b54;outline-offset:4px}
/* D28: reduce the frame's visual weight around the completed document. */
body #connections .sc-board{padding:22px;gap:20px;border-radius:24px;border-color:#bdd8ca;box-shadow:0 12px 34px #254d4008}
/* D29: readable source controls, visually separate from document output. */
body #connections .sc-source{font-size:14px;line-height:1.7;min-height:48px;padding:12px;background:#f8fcfa}
/* D30: a consistent document title scale. */
body #connections .sc-result .la-artifact>h4{font-size:clamp(25px,2.2vw,32px);line-height:1.5;letter-spacing:-.025em;margin-bottom:18px}
/* D31: make the proposal's actual body comfortably readable. */
body #connections .sc-result .la-document-text{font-size:15px;line-height:1.95;max-width:60ch}
/* D32: quiet headers and stable numerals in real example tables. */
body #connections .sc-result table{font-size:14px;font-variant-numeric:tabular-nums;line-height:1.8}
body #connections .sc-result th{background:#edf6f0;font-weight:700}
/* D33: separate rows without a heavy grid. */
body #connections .sc-result td{padding:12px 9px;border-color:#d9e7df;vertical-align:top}
body #connections .sc-result tbody tr:nth-child(even){background:#f6faf8}
/* D34: align the other completed artifacts as readable controls. */
body #connections .sc-related{min-height:48px;font-size:13px;line-height:1.7;border-color:#bfd6ca;background:#f8fbf9;padding:12px 14px}
/* D35: keep the companions distinct from the white paper beneath them. */
body #connections .sc-result .sc-peek{z-index:2;filter:drop-shadow(0 8px 8px #244b421c)}
body #connections .sc-result .sc-peek-friend{z-index:1}
/* D36: clarify the selected process step without changing the component. */
body #demo .lgp-steps button{min-height:54px;border-radius:10px;padding:12px;font-size:14px}
body #demo .lgp-steps button[aria-current="step"],body #demo .lgp-steps button[aria-pressed="true"]{background:#e2f0e8;border-color:#82ad97}
/* D37: a more comfortable line length inside downloadable document examples. */
body #demo .lgp-document p{max-width:62ch;font-size:15px;line-height:1.95}
/* D38: separate file type, filename and download affordance. */
body #demo .lgp-deliverables button{min-height:74px;padding:14px 18px;gap:16px;border-radius:12px}
body #demo .lgp-deliverables button small{font-size:13px;line-height:1.6}
/* D39: readable text in the memory diagram. */
body #memory .source-node{padding:16px 12px;min-height:145px;height:auto;border-radius:14px}
body #memory .ct-node-body{font-size:12px;line-height:1.8}
body #main #memory .memory-n02{top:-20px;left:-3%;width:36%}
body #memory .memory-phrase{display:inline-block;white-space:nowrap}
/* D40: the record disclosure stays visibly interactive. */
body #memory .memory-disclosure .ui-acc-h button{min-height:54px;padding:16px;font-size:15px;line-height:1.7;background:#f8fcfa}
/* D41: consistent surfaces and padding across the eight job groups. */
body #capabilities .capability-group{background:#ffffffed;border-color:#c3dace;border-radius:18px;padding:24px}
/* D42: make the actual job links as readable as the category titles. */
body #capabilities .capability-group li a{font-size:14px;line-height:1.75;min-height:46px;gap:12px;padding-block:9px}
/* D43: balance the category counts with the nearby character. */
body #capabilities .capability-counts strong{font-size:40px;line-height:1.2;font-variant-numeric:tabular-nums}
/* D44: clearly identify the role behind a usage record. */
body #cases .ls-role{font-size:13px;line-height:1.75;letter-spacing:.02em;margin-bottom:10px}
/* D45: make the human verification note easy to find. */
body #cases .ls-check{font-size:13px;line-height:1.9;padding:14px 16px;border-left:3px solid #94b8a5;background:#f8fcfa;border-radius:0 10px 10px 0}
/* D46: readable price hierarchy and billing unit. */
body .product-price-amount{font-size:44px;line-height:1.25;letter-spacing:-.025em;margin-bottom:16px}
body .product-price-amount span{display:block;font-size:14px;line-height:1.8;letter-spacing:0;margin:5px 0 0}
/* D47: one comfortable question-and-answer scale. */
body #conditions .faq .ui-acc-h button{font-size:16px;line-height:1.75;min-height:62px;padding:18px}
body #conditions .faq .ui-acc-b{font-size:14px;line-height:1.95;padding:0 18px 20px}
/* D48: make the optional nature of the consultation form explicit. */
body .consult-form-head>span{font-size:12px;line-height:1.6;background:#edf5f0;border:1px solid #c5dbce;border-radius:20px;padding:4px 10px;color:#426453}
/* D49: larger input text, comfortable internal padding and a clean focus ring. */
body .consult-form .xb-in{font-size:16px;line-height:1.8;border-radius:12px;padding:13px 14px;border-color:#88a99a;min-height:50px;box-shadow:0 1px 3px #315e4c05}
body .consult-form textarea.xb-in{min-height:160px}
/* D50: readable footer destinations and update record. */
body .footer-nav a,body .footer-bottom>a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;padding-block:8px;text-underline-offset:4px}
body .content-revision{font-size:12px;line-height:1.9;max-width:70em;margin-top:20px;color:#587265}

@media(max-width:850px){
 body #connections .sc-board{padding:14px;gap:14px}
 body #connections .sc-result table{font-size:13px}
 body #connections .sc-result td{padding:10px 6px}
 body #connections .sc-source{font-size:13px}
}
@media(max-width:600px){
 body main .section-wrap{width:calc(100% - 44px)}
 body .ly-facts{padding:16px 20px}
 body #about.lgp-product{width:calc(100% - 28px);padding:24px 18px;gap:20px}
 body #about .lgp-product-copy{padding-block:0}
 body #hero-search-form{padding:18px}
 body #capabilities .capability-group{padding:18px 20px}
 body #capabilities .capability-counts strong{font-size:34px}
 body #demo .lgp-steps button{padding:10px 8px}
 body .product-price-amount{font-size:38px}
 body .consult-form-head{align-items:center;gap:10px}
 body #connections .la-option{padding:11px 16px}
 body #main #memory .source-node{padding:14px 5px;min-height:145px}
 body #main #memory .memory-n02{top:4px;left:0;width:42%}
 body #main #memory .memory-graph{height:auto;display:grid;grid-template-columns:1fr;gap:22px;padding-top:112px;padding-bottom:96px}
 body #main #memory .memory-source-list{position:static;inset:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%}
 body #main #memory .source-node{inset:auto;min-height:132px}
 body #main #memory .request-node{position:relative;inset:auto;transform:none;justify-self:center;margin:0;width:210px;min-height:86px}
 body #main #memory .result-node{position:relative;inset:auto;transform:none;justify-self:center;margin:0;width:min(280px,100%);height:auto;min-height:168px}
 body #main #memory .memory-return{position:relative;inset:auto;justify-self:center;width:auto;margin:0;text-align:center}
 body #main #memory .memory-n03{bottom:0;right:0}
 body #main #memory .memory-ask{inset:auto 120px 28px auto}
}
@media(prefers-reduced-motion:reduce){body :is(a,button,input,textarea){transition:none!important}}
