@charset "UTF-8";
.case-detail-page { background:var(--paper); }
.case-detail-page .site-header.is-scrolled { position:fixed;inset:0 0 auto;background:#fff;color:var(--ink); }
.case-detail-page .site-header:not(.is-scrolled) { position:absolute;inset:0 0 auto;background:transparent;color:#fff;border-bottom-color:#ffffff26; }
.case-detail-page .site-header:not(.is-scrolled) :is(.main-nav>a[aria-current],.nav-parent>a[aria-current]) { color:#fff; }
.case-detail-page .site-header:not(.is-scrolled) .header-phone { border-left-color:#ffffff45; }
.case-detail-page .site-header:not(.is-scrolled) .brand-logo-light { opacity:1; }
.case-detail-page .site-header:not(.is-scrolled) .brand-logo-dark { opacity:0; }
.case-detail-page .site-header:not(.is-scrolled) .brand-logo-custom { filter:brightness(0) invert(1); }
.case-project { position:relative;display:flow-root;isolation:isolate;overflow:clip;background:#213e36; }
.case-backdrop { position:sticky;top:0;height:100vh;height:100svh;margin-bottom:-100vh;margin-bottom:-100svh;overflow:hidden;pointer-events:none;user-select:none;z-index:0; }
.case-backdrop>img { width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;filter:blur(10px);transform:scale(1.1); }
.case-backdrop::after { content:"";position:absolute;inset:0;background:linear-gradient(180deg,#071810a6,#07181047 65%,#07181026); }
.case-project-content { position:relative;z-index:1;color:#fff;padding-bottom:5vw; }
.case-wrap { width:80%;max-width:1300px;margin-inline:auto; }
.case-detail-page .case-overview { display:grid;grid-template-columns:55% 30%;justify-content:space-between;gap:0;padding-top:calc(92px + 5vw);padding-bottom:4vw; }
.case-detail-page .case-overview h1 { font-size:clamp(32px,2.5vw,48px);font-weight:500;line-height:1.4;letter-spacing:0; }
.case-detail-page .case-overview>div>p { margin-top:2vw;font-size:16px;line-height:2;color:#fff;text-align:justify; }
.case-detail-page .project-facts { padding:0;margin:0; }
.case-detail-page .project-facts>div { grid-template-columns:80px minmax(0,1fr);gap:0;border:0;padding:0 0 25px; }
.case-detail-page .project-facts dt { color:#ffffffe0;padding:0;font-size:16px;line-height:30px; }
.case-detail-page .project-facts dd { font-size:16px;line-height:30px;min-width:0; }
.case-detail-page .project-website-trigger { -webkit-appearance:none;appearance:none;display:inline;padding:0;border:0;border-radius:0;box-shadow:none;background:none;color:inherit;text-align:left;overflow-wrap:anywhere;text-decoration:underline;text-underline-offset:7px;text-decoration-color:#ffffff90;transition:color .2s; }
.case-detail-page .project-website-trigger:is(:hover,:focus,:active) { background:none;box-shadow:none; }
.case-detail-page .project-website-trigger:hover { color:#f0d69d; }
.case-detail-page .project-service-tags { display:flex;flex-wrap:wrap;gap:5px;align-content:flex-start; }
.project-service-tags>span { display:block;padding:5px 10px;border-radius:50px;background:#ffffff30;font-size:14px;line-height:20px; }
.case-showcase { padding:5vw 10vw;background:#eff3f6;color:var(--ink); }
.case-showcase-content.article-body { padding:0;font-size:16px; }
.case-showcase-content :is(p,figure) { margin:0; }
.case-showcase-content>p:empty { display:none; }
.case-showcase-content img { display:block;width:100%;max-width:100%;height:auto!important;max-height:none;object-fit:contain;margin:0;box-shadow:30px 30px 80px #00000014; }
.case-showcase-content :is(p,figure):has(img),.case-showcase-content>img { margin:0 0 25px; }
.case-showcase-content>:last-child { margin-bottom:0; }
.project-website-dialog { width:min(560px,calc(100% - 40px));max-height:calc(100svh - 40px);margin:auto;padding:0;border:1px solid var(--line);border-radius:0;background:var(--paper);color:var(--ink);box-shadow:0 20px 70px #061b1526;overflow:auto; }
.project-website-dialog::backdrop { background:#061b1570; }
.project-website-notice { padding:38px 42px 34px; }
.project-website-heading { display:flex;align-items:center;justify-content:space-between;gap:20px; }
.project-website-heading .eyebrow { color:var(--muted);font-size:11px;font-weight:400;letter-spacing:.06em; }
.project-website-heading .osmanthus-icon { width:22px;height:22px;color:var(--orange); }
.project-website-close { -webkit-appearance:none;appearance:none;display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;padding:5px;background:none;border:0;border-radius:0;color:var(--muted);transition:color .2s; }
.project-website-close:hover { background:none;color:var(--ink); }
.project-website-close svg { width:20px;height:20px; }
.project-website-notice h2 { margin-top:28px;font-size:30px;line-height:1.5;letter-spacing:.01em;font-weight:500; }
.project-website-notice h2:focus { outline:none; }
.project-website-notice>p { margin-top:16px;font-size:14px;line-height:1.9;color:var(--muted); }
.project-website-notice .project-website-destination { margin-top:20px;padding:0 0 24px;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--ink);font-size:16px;overflow-wrap:anywhere; }
.project-website-actions { display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:26px; }
.project-website-cancel { -webkit-appearance:none;appearance:none;padding:8px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--muted);font-size:13px;line-height:1.6;transition:color .2s,border-color .2s; }
.project-website-cancel:is(:hover,:focus,:active) { background:none; }
.project-website-cancel:hover { color:var(--ink);border-color:var(--ink); }
.project-website-actions .arrow-link { min-width:150px;height:48px;font-size:13px; }
@media(max-width:1100px) {
  .case-detail-page .case-overview { padding-top:calc(80px + 5vw);grid-template-columns:55% 35%; }
  .case-wrap { width:90%; }
  .case-detail-page .case-overview>div>p,.case-detail-page .project-facts :is(dt,dd) { font-size:14px; }
  .case-detail-page .project-facts>div { grid-template-columns:70px minmax(0,1fr);padding-bottom:18px; }
  .project-service-tags>span { font-size:12px;padding:4px 9px; }
  .case-showcase { padding:5vw; }
  .case-detail-page.menu-open .site-header { background:#fff;color:var(--ink); }
  .case-detail-page.menu-open .site-header .brand-logo-light { opacity:0; }
  .case-detail-page.menu-open .site-header .brand-logo-dark { opacity:1; }
  .case-detail-page.menu-open .site-header .brand-logo-custom { filter:none; }
  .case-detail-page .site-header:not(.is-scrolled) .main-nav :is(a[aria-current],.nav-parent>a[aria-current]) { color:#608a3a; }
}
@media(max-width:760px) {
  .case-detail-page .site-header:not(.is-scrolled) { position:fixed;background:#fff;color:var(--ink);border-bottom-color:var(--line); }
  .case-detail-page .site-header:not(.is-scrolled) .brand-logo-light { opacity:0; }
  .case-detail-page .site-header:not(.is-scrolled) .brand-logo-dark { opacity:1; }
  .case-detail-page .site-header:not(.is-scrolled) .brand-logo-custom { filter:none; }
  .case-backdrop>img { transform:scale(1.06); }
  .case-detail-page .case-overview { grid-template-columns:minmax(0,1fr);gap:28px;padding-top:118px;padding-bottom:32px; }
  .case-detail-page .case-overview h1 { font-size:30px; }
  .case-detail-page .case-overview>div>p { margin-top:22px;line-height:2; }
  .case-detail-page .project-facts>div { grid-template-columns:70px minmax(0,1fr);padding-bottom:10px; }
  .case-detail-page .project-facts :is(dt,dd) { font-size:12px;line-height:26px; }
  .project-service-tags>span { font-size:11px;line-height:20px;padding:3px 9px; }
  .case-detail-page .project-facts>div:last-child { padding-bottom:0; }
  .case-showcase { padding:0; }
  .case-showcase-content :is(p,figure):has(img),.case-showcase-content>img { margin-bottom:15px; }
  .case-showcase-content>:last-child { margin-bottom:0; }
  .case-project-content { padding-bottom:32px; }
  .project-website-notice { padding:26px 24px; }
  .project-website-notice h2 { margin-top:22px;font-size:25px; }
  .project-website-notice>p { font-size:13px; }
  .project-website-notice .project-website-destination { padding-bottom:20px;font-size:14px; }
  .project-website-actions { margin-top:22px;gap:20px; }
  .project-website-actions .arrow-link { min-width:132px;height:44px;font-size:12px; }
}