/* Preview projects: a small portfolio, with the LINE design as the visual. */
.case-studies-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start}
.case-study-card{min-width:0;background:#fff;scroll-margin-top:100px;border:1px solid #c6d3be;transition:box-shadow .25s,transform .25s}
.case-study-card:hover{box-shadow:0 12px 30px #163e2a12}
.case-poster{--poster-ink:#1d573b;--poster-fill:#cedfbd;position:relative;isolation:isolate;height:356px;overflow:hidden;background:var(--poster-fill);color:var(--poster-ink)}
.case-poster--sand{--poster-fill:#ece3cc;--poster-ink:#715b2b}
.case-poster--forest{--poster-fill:#204e3d;--poster-ink:#fff}
.case-poster__copy{position:relative;z-index:2;display:flex;align-items:flex-start;gap:18px;padding:25px 24px}
.case-poster__number{font:400 15px/1.8 Georgia,serif;letter-spacing:.08em;border-bottom:1px solid currentColor}
.case-poster__copy p{font-size:20px!important;font-weight:700;line-height:1.65!important;margin:0!important;letter-spacing:.035em;color:inherit!important}
.case-poster__orbit{position:absolute;z-index:-1;width:290px;height:290px;border:1px solid currentColor;opacity:.15;border-radius:50%;right:-85px;bottom:-65px}
.case-phone{position:absolute;z-index:1;width:198px;left:50%;bottom:-54px;padding:21px 10px 56px;background:#f4f7ef;color:#204e3d;border:5px solid #25533e;border-radius:26px;transform:translateX(-50%) rotate(-7deg);box-shadow:17px 16px 0 #234c2e16;transition:transform .4s cubic-bezier(.2,.75,.25,1)}
.case-poster--sand .case-phone{transform:translateX(-50%) rotate(7deg);border-color:#756139;box-shadow:17px 16px 0 #75613918}
.case-poster--forest .case-phone{transform:translateX(-50%) rotate(-5deg);border-color:#b4cbb9;box-shadow:17px 16px 0 #081a1226}
.case-study-card:hover .case-phone{transform:translateX(-50%) translateY(-5px) rotate(0)}
.case-phone__bar{position:absolute;top:7px;left:calc(50% - 18px);width:36px;height:4px;background:#254e3c;border-radius:3px}
.case-phone__title{font-size:10px!important;line-height:1.5!important;font-weight:700;text-align:center;border-bottom:1px solid #c8d6c9;padding-bottom:12px;margin:0 0 17px!important;color:#254e3c!important}
.case-phone__message{display:flex;gap:6px;align-items:flex-start;font-size:9px;line-height:1.7}
.case-phone__avatar{display:grid;place-items:center;flex:none;width:21px;height:21px;border-radius:50%;background:#285b41;color:white;font:12px Georgia,serif}
.case-phone__message>span:last-child{padding:8px;background:#fff;border-radius:0 8px 8px 8px}
.case-phone__art{display:grid;place-items:center;padding:14px 0 12px;color:#285b41}
html body.site-unified .case-phone__art svg{width:46px!important;height:46px!important;color:inherit}
.case-phone__action{display:flex;justify-content:space-between;gap:5px;align-items:center;padding:12px 9px;background:#285b41;color:#fff;font-size:10px;font-weight:700}
.case-phone__menus{display:grid;grid-template-columns:1fr 1fr;gap:3px;margin-top:3px;font-size:8px;font-weight:700;text-align:center}
.case-phone__menus>span{background:#dfebd7;padding:10px 2px}
.case-study-body{padding:25px 24px 27px}
.case-study-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.case-study-meta p{font-size:12px!important;font-weight:700;color:#405b4a;margin:0!important;line-height:1.5!important}
.case-preview-label{font-size:10px;letter-spacing:.04em;color:#59624f;background:#f0f1e8;padding:4px 7px;white-space:nowrap}
html body.site-unified .case-study-body h3{font-size:clamp(19px,1.55vw,23px);line-height:1.65;letter-spacing:0;color:#173e2b;margin:0 0 20px}
.case-study-body h3>span{display:block}
.case-study-tags{display:flex;list-style:none!important;flex-wrap:wrap;gap:8px 12px;padding:0!important;margin:0 0 24px!important;color:#556b59}
.case-study-tags li{font-size:11px!important;padding:0!important;border:0!important;line-height:1.5!important}
.case-study-tags li::before{content:'／';margin-right:4px;color:#9cac92}
.case-study-link,.case-study-detail summary{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid #c3d0bc;padding-top:18px;font-size:14px;font-weight:700;color:#1f5e3b;text-decoration:none;list-style:none;cursor:pointer}
.case-study-link:hover{text-decoration:underline;text-underline-offset:5px}
.case-study-detail summary::-webkit-details-marker{display:none}
.case-study-detail summary>span{font-size:20px;font-weight:400}
.case-study-detail[open] summary>span{transform:rotate(45deg)}
.case-study-detail>div{padding-top:22px}
.case-study-detail dl{margin:0}
.case-study-detail dt{font-size:12px;color:#657c59;font-weight:700;margin:0 0 7px}
.case-study-detail dd{font-size:14px;line-height:1.9;margin:0 0 22px;color:#304d3d}
.case-study-route{display:flex;flex-direction:column;gap:14px;list-style:none;padding:16px;margin:0;background:#eff3e9;text-align:center}
.case-study-route li{font-size:12px;color:#244d34;position:relative}
.case-study-route li:not(:last-child)::after{content:'↓';display:block;color:#7d946b;position:absolute;top:100%;left:calc(50% - 5px);line-height:14px;font-size:11px}
.case-study-link:focus-visible,.case-study-detail summary:focus-visible{outline:2px solid #9a762c;outline-offset:6px}
.case-studies-page .renewal-hero__title>span{display:block}
.case-studies-page .case-studies-section{padding-block:72px 88px}
.case-studies-page .case-studies-section>.wrap>h2{margin-bottom:36px}
.case-studies-page .case-studies-section>.wrap>h2 span{display:inline-block}
html body.renewed-home .home-models-section .home-section-actions{margin-top:40px}
@media(min-width:768px) and (max-width:1100px){
 .case-studies-grid{gap:16px}
 .case-study-body{padding:22px 16px}
 .case-poster{height:310px}
 .case-poster__copy{padding:20px 16px;gap:10px}
 .case-poster__copy p{font-size:16px!important}
 .case-phone{width:170px;bottom:-65px}
 html body.site-unified .case-study-body h3{font-size:18px}
 .case-study-meta{gap:8px}
}
@media(max-width:767px){
 .case-studies-grid{grid-template-columns:1fr;gap:28px}
 .case-poster{height:330px}
 .case-poster__copy{padding:25px 26px;gap:20px}
 .case-poster__copy p{font-size:21px!important}
 .case-phone{width:196px;bottom:-65px}
 .case-study-body{padding:25px 24px}
 html body.site-unified .case-study-body h3{font-size:23px}
 .case-study-meta{margin-bottom:18px}
 .case-studies-page .case-studies-section{padding-block:52px 64px}
}
@media(prefers-reduced-motion:reduce){.case-study-card,.case-phone{transition:none}.case-study-card:hover .case-phone{transform:translateX(-50%) rotate(-7deg)}.case-poster--sand .case-phone,.case-poster--forest .case-phone{transform:translateX(-50%) rotate(0)}}
/* Keep the headline outside the phone illustration, with a deliberate crop. */
.case-phone{top:118px;bottom:auto;padding-bottom:24px}
.case-phone__title{padding-bottom:8px;margin-bottom:12px!important}
.case-phone__art{padding:10px 0}
html body.site-unified .case-phone__art svg{width:34px!important;height:34px!important}
.case-phone__action{padding-block:10px}
.case-phone__menus>span{padding-block:8px}
@media(min-width:768px) and (max-width:1100px){.case-phone{top:100px;bottom:auto}.case-phone__art{padding:8px 0}}
@media(max-width:767px){.case-phone{top:120px;bottom:auto}.case-poster{height:356px}}
@media(min-width:768px) and (max-width:1023px){
 .case-studies-grid{grid-template-columns:1fr;gap:24px}
 .case-study-card{display:grid;grid-template-columns:.9fr 1.1fr}
 .case-poster{height:340px}
 .case-poster__copy{padding:25px 20px}
 .case-poster__copy p{font-size:20px!important}
 .case-phone{width:196px;top:118px}
 .case-study-body{padding:30px 26px}
 html body.site-unified .case-study-body h3{font-size:22px}
 .case-study-meta{margin-bottom:24px}
}