.service-detail-page{background:#faf8f0;overflow-wrap:break-word}
.detail-breadcrumb{display:flex;flex-wrap:wrap;gap:12px;padding-block:25px;color:#607568;font-size:12px}
.detail-breadcrumb a,.detail-back{color:#355e47;text-decoration:underline;text-underline-offset:5px}
.detail-hero{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding-block:30px 60px}
.detail-hero h1{font-family:var(--serif);font-size:clamp(32px,4vw,52px);font-weight:600;line-height:1.5;color:#315641;letter-spacing:.05em}
.detail-tagline{font-family:var(--serif);font-size:23px;line-height:1.8;margin-top:20px;color:#345f49}
.detail-lead{font-size:14px;line-height:2.1;color:#53675c;margin-block:20px 27px}
.detail-hero figure{margin:0;min-width:0}.detail-hero figure img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:70px 8px 8px 8px}
.detail-hero figcaption{font-size:10px;color:#65756b;text-align:right;margin-top:9px}
.detail-small{font-size:12px;color:#586e60;line-height:1.9;margin-top:15px}
.detail-jump{display:flex;flex-wrap:wrap;gap:10px;border-block:1px solid #d1ddcf;padding-block:18px}
.detail-jump a{padding:9px 18px;border:1px solid #c5d5c6;border-radius:24px;background:#fffef8;font-size:13px;color:#365e48;min-height:44px}
.detail-jump a:hover{background:#e7efe2}.detail-section{padding-block:70px;scroll-margin-top:90px}
.detail-section h2{font-family:var(--serif);font-size:28px;color:#315641;letter-spacing:.035em;margin-bottom:28px}
.detail-section h3{font-size:18px;line-height:1.8;color:#335b45;margin-bottom:12px}
.detail-section p,.detail-section li{font-size:14px;color:#52665a;line-height:2}
.detail-section .eyebrow{font-size:11px;color:#647d5c}.detail-topics{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.detail-topics article{background:#fffef9;border:1px solid #d6dfce;border-radius:12px;padding:27px}
.detail-role{border-left:3px solid #8d9f68;background:#eef2e6;padding:25px 30px;margin-top:26px}
.detail-role h3{font-size:16px}.detail-tint{background:#f0f3e9}.detail-steps{padding:0;margin:0;list-style:none;display:grid;gap:23px}
.detail-steps li{display:flex;gap:27px;border-bottom:1px solid #d1ddcb;padding-bottom:23px}.detail-step-number{font:36px Georgia,serif;color:#668167;padding-top:5px}
.detail-steps h3{margin-bottom:8px}.detail-preparation{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:start}
.detail-preparation aside{background:#fffef9;padding:28px;border:1px solid #d6dfce;border-radius:12px}.detail-preparation aside h2{font-size:23px}
.detail-preparation ul{padding-left:1.3em;margin-block:22px 0}.detail-preparation li{margin-block:8px}
.detail-faq{display:grid;grid-template-columns:1fr 1.7fr;gap:60px}.detail-faq .faq-list details>p{font-size:14px}
.detail-contact{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center}.detail-contact-actions{display:grid;gap:14px}
.detail-contact-actions .detail-small{margin:0}.detail-contact .button,.detail-hero .button{background:#416953;border-color:#416953;gap:16px;line-height:1.8;min-height:54px}
.detail-contact .button.outline{background:transparent;color:#365c46}.detail-contact .button:hover,.detail-hero .button:hover{background:#2f543f;color:#fff}
.detail-back{font-size:13px;padding-block:8px;min-height:44px}.detail-related{background:#eef1e6}
.detail-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.detail-related-grid a{padding:23px;background:#fffef9;border:1px solid #cbd8c6;border-radius:9px;color:#315641}
.detail-related-grid a>span:first-child{font-size:17px;font-weight:600}.detail-related-grid p{margin-top:10px;font-size:12px}.detail-related-grid a>span:last-child{display:block;text-align:right}.detail-related-grid a:hover{border-color:#416953}
@media(max-width:1000px){.detail-hero{gap:30px}.detail-topics{gap:12px}.detail-topics article{padding:20px}.detail-faq,.detail-preparation,.detail-contact{gap:30px}.detail-contact h2{font-size:25px}}
@media(max-width:640px){.detail-breadcrumb{font-size:11px;padding-block:18px}.detail-hero{grid-template-columns:1fr;gap:28px;padding-block:18px 35px}.detail-hero h1{font-size:34px}.detail-tagline{font-size:21px;margin-top:16px}.detail-hero .button{width:100%;font-size:13px;padding-inline:20px}.detail-hero figure img{border-top-left-radius:44px}.detail-jump{gap:7px;padding-block:14px}.detail-jump a{font-size:11px;padding:9px 12px}.detail-section{padding-block:45px}.detail-section h2{font-size:24px;line-height:1.8;margin-bottom:23px}.detail-topics,.detail-preparation,.detail-faq,.detail-contact,.detail-related-grid{grid-template-columns:1fr}.detail-topics{gap:15px}.detail-topics article{padding:23px}.detail-role{padding:22px}.detail-section h3{font-size:17px}.detail-steps li{gap:18px}.detail-step-number{font-size:29px}.detail-preparation aside{padding:23px}.detail-preparation aside h2{font-size:22px}.detail-faq{gap:0}.detail-faq .faq-list summary{font-size:13px}.detail-faq .faq-list details>p{font-size:13px}.detail-contact{gap:25px}.detail-contact .button{font-size:13px;padding-inline:19px}.service-detail-page .site-footer{padding-bottom:20px}}
/* Construction scenarios explain possible plans, separate from actual case studies. */
.name-part{white-space:nowrap}
.detail-planning-examples{display:grid;gap:22px}
.detail-planning-examples article{display:grid;grid-template-columns:50px minmax(0,1fr);gap:24px;padding:30px;background:#fffef9;border:1px solid #d6dfce;border-radius:12px}
.detail-planning-examples h3{font-family:var(--serif);font-size:24px}
.detail-planning-examples .planning-wish{color:#355f48;font-size:16px}
.detail-planning-examples dl{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:23px 0 0;padding-top:23px;border-top:1px solid #d6dfce}
.detail-planning-examples dt{font-size:12px;font-weight:600;color:#4f704d;margin-bottom:10px}
.detail-planning-examples dd{margin:0;font-size:14px;line-height:2;color:#52665a}
@media(max-width:640px){.detail-planning-examples article{display:block;padding:23px}.detail-planning-examples .detail-step-number{display:block;margin-bottom:12px}.detail-planning-examples h3{font-size:21px}.detail-planning-examples .planning-wish{font-size:14px}.detail-planning-examples dl{grid-template-columns:1fr;gap:21px}.detail-hero h1:has(.name-part){font-size:clamp(28px,8vw,34px)}}
