/* Screenshot-led homepage. Existing routes retain their own presentation. */
body[data-page="home"] { --ref-orange: #eb5518; --ref-ink: #292929; background: #fff; color: var(--ref-ink); }
#page-home { background: #fff; }
#page-home *, #page-home *::before, #page-home *::after { box-sizing: border-box; letter-spacing: 0; }
#page-home button, #page-home a { -webkit-tap-highlight-color: transparent; }
#page-home button { cursor: pointer; font-family: inherit; }
#page-home button:focus-visible, #page-home a:focus-visible, #page-home summary:focus-visible { outline: 2px solid #eb5518; outline-offset: 5px; }
body[data-page="home"] .site-header,
body[data-page="home"] .site-header.is-home-hero { background: rgba(231,231,231,.96); border: 0; box-shadow: none; backdrop-filter: blur(12px); }
body[data-page="home"] .site-header .brand img,
body[data-page="home"] .site-header.is-home-hero .brand img { filter: none; }
body[data-page="home"] .site-header .nav-link,
body[data-page="home"] .site-header.is-home-hero .nav-link { color: #333; font-size: 13px; background: transparent; }
body[data-page="home"] .site-header .nav-link:hover,
body[data-page="home"] .site-header .nav-link.active { color: #eb5518; }
body[data-page="home"] .site-header .nav-login,
body[data-page="home"] .site-header.is-home-hero .nav-login { border: 1px solid #aaa; border-radius: 30px; background: transparent; color: #333; }
body[data-page="home"] .site-header .menu-toggle span { background: #333 !important; }
body[data-page="home"] .site-header .menu-toggle { border-color: #aaa !important; }
.reference-hero { position: relative; height: 720px; max-height: 90svh; min-height: 550px; overflow: hidden; background: #e7e7e7; isolation: isolate; }
.reference-hero__art { position: absolute; top: 94px; width: 100%; height: calc(100% - 94px); object-fit: contain; object-position: 50% 100%; z-index: 2; mix-blend-mode: darken; pointer-events: none; }
.reference-hero__word { position: absolute; inset: 27% 0 auto; text-align: center; white-space: nowrap; font-family: Arial, sans-serif; font-size: 170px; font-weight: 700; line-height: 1; color: #eb5518; z-index: 1; }
.reference-hero__caption { position: absolute; bottom: 64px; left: 4%; z-index: 3; max-width: 280px; }
.reference-hero__caption h1 { font-size: 26px; font-weight: 600; margin: 0 0 12px; line-height: 1.4; }
.reference-hero__caption p { margin: 0; font-size: 20px; line-height: 1.45; color: #444; }
.reference-hero__links { position: absolute; right: 4%; bottom: 64px; display: grid; gap: 14px; z-index: 3; }
.reference-hero__links button { background: none; border: 0; color: #777; padding: 0; text-align: left; font-size: 13px; }
.reference-hero__links button:hover { color: #eb5518; }
.reference-services { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 10px; }
.reference-service { min-width: 0; position: relative; height: 460px; border-radius: 7px; overflow: hidden; background: #101010; isolation: isolate; }
.reference-service > img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.reference-service:hover > img { transform: scale(1.035); }
.reference-service::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top,rgba(0,0,0,1) 0%,rgba(0,0,0,.82) 20%,rgba(235,85,24,.28) 51%,rgba(235,85,24,0) 78%); z-index: 1; pointer-events: none; }
.reference-service__copy { position: absolute; bottom: 32px; left: 24px; right: 24px; text-align: center; z-index: 2; color: #fff; }
.reference-service__copy h2 { margin: 0 0 8px; font-size: 25px; font-weight: 500; color: inherit; }
.reference-service__copy p { font-size: 14px; line-height: 1.6; margin: 0 0 16px; color: rgba(255,255,255,.8); }
.reference-service__copy button, .reference-about__intro > button { display: inline-flex; align-items: center; gap: 14px; padding: 8px 16px; background: #fff; border: 0; border-radius: 30px; color: #333; font-size: 12px; transition: color .2s,background .2s; }
.reference-service__copy button:hover { background: #eb5518; color: #fff; }
.reference-service--maker > img { object-position: center; }
.reference-service--record > img { object-fit: contain; padding: 94px 18% 0; filter: grayscale(1); }
.reference-service--record .reference-service__copy { top: 32px; bottom: auto; }
.reference-service--record::after { display: none; }
.reference-service--record > img { object-fit: cover; padding: 0; filter: none; }
.reference-service--record .reference-service__copy { top: auto; bottom: 32px; }
.reference-service--record::after { display: block; }
.reference-process { padding: 100px 0 60px; }
.reference-process > header { text-align: center; padding: 0 24px 35px; }
.reference-process h2 { font-size: 28px; font-weight: 500; margin: 0 0 12px; }
.reference-process > header p { font-size: 16px; color: #888; line-height: 1.5; }
.reference-process__track { display: flex; overflow-x: auto; gap: 18px; padding: 0 8%; scroll-snap-type: x mandatory; scrollbar-width: none; }
.reference-process__track::-webkit-scrollbar { display: none; }
.reference-process__track article { position: relative; flex: 0 0 43%; height: 370px; border-radius: 5px; overflow: hidden; scroll-snap-align: center; padding: 28px; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; isolation: isolate; }
.reference-process__track article::after { position: absolute; inset: 0; content: ""; background: linear-gradient(to top,rgba(0,0,0,1) 0%,rgba(0,0,0,.8) 21%,rgba(235,85,24,.26) 53%,rgba(235,85,24,0) 80%); z-index: -1; }
.reference-process__track article img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .65s cubic-bezier(.22,.61,.36,1); transform: scale(1); }
.reference-process__track article > span { position: absolute; top: 24px; left: 28px; font-size: 14px; }
.reference-process__track h3 { font-size: 23px; margin: 0 0 10px; font-weight: 500; color: #fff; }
.reference-process__track p { max-width: 28em; margin: 0; font-size: 14px; line-height: 1.65; color: #eee; }
.reference-process__controls { display: flex; justify-content: flex-end; gap: 8px; margin: 18px 8% 0; }
.reference-process__controls button { border: 0; border-radius: 50%; width: 34px; height: 34px; background: #f2f2f2; color: #555; }
.reference-process__controls button:hover { background: #eb5518; color: white; }
@media(min-width:769px) and (hover:hover) and (pointer:fine) {
  .reference-process__track article:hover img { transform: scale(1.08); }
}
.reference-links { max-width: 1100px; margin: 36px auto 110px; padding: 0 24px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.reference-links__head { grid-column: 1 / -1; width: 100%; max-width: 860px; margin: 0 auto 22px; padding: 0 12px; text-align: center; }
#page-home .reference-links__head h2 { margin: 0; color: #333 !important; font-size: clamp(28px, 2.8vw, 40px); font-weight: 500; line-height: 1.3; text-align: center; text-wrap: balance; overflow-wrap: anywhere; }
.reference-links__head p { max-width: 760px; margin: 14px auto 0; color: #888; font-size: 16px; line-height: 1.75; text-align: center; text-wrap: balance; overflow-wrap: anywhere; }
.reference-links > a, .reference-links > button { position: relative; display: flex; min-height: 300px; flex-direction: column; justify-content: flex-end; align-items: center; text-align: center; color: #fff; background: #1d1d1f; text-decoration: none; border: 0; border-radius: 6px; padding: 30px 18px; overflow: hidden; isolation: isolate; }
.reference-links > a::after, .reference-links > button::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to top,rgba(0,0,0,1) 0%,rgba(0,0,0,.82) 24%,rgba(235,85,24,.25) 58%,rgba(235,85,24,0) 86%); pointer-events:none; }
.reference-links > a > span:first-child, .reference-links > button > span:first-child { font-size: 12px; color: rgba(255,255,255,.72); position:relative; z-index:1; }
.reference-links h2 { font-size: 19px; font-weight: 500; margin: 9px 0 14px; color:#fff; position:relative; z-index:1; }
.reference-more { font-size: 12px; display: inline-flex; align-items: center; gap: 10px; position:relative; z-index:1; }
.reference-more b { display: inline-grid; place-items: center; background: #eb5518; color: #fff; border-radius: 50%; width: 20px; height: 20px; }
.reference-links img { position:absolute; inset:0; z-index:-2; width:100%; height:100%; margin:0; object-fit:cover; display:block; transition:transform .5s; }
.reference-links > :hover img { transform: scale(1.035); }
.reference-about { padding: 80px max(6%,24px) 100px; background: #f7f7f7; display: grid; grid-template-columns: 1fr 1.1fr; gap: 9%; }
.reference-about h2 { font-size: 28px; font-weight: 500; margin: 0 0 24px; }
#page-home .reference-about__intro > h2 { text-align: left !important; }
.reference-about p, .reference-about li { font-size: 14px; line-height: 1.85; color: #888; }
.reference-about ul { padding-left: 18px; margin: 20px 0 28px; }
.reference-about__intro > button { background: #ececec; }
.reference-about__intro > button:hover { background: #eb5518; color: #fff; }
.reference-faq details { border-bottom: 1px solid #ddd; padding: 20px 0; }
.reference-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; font-size: 14px; line-height: 1.6; }
.reference-faq summary::-webkit-details-marker { display: none; }
.reference-faq summary::after { content: "+"; flex: 0 0 16px; }
.reference-faq details[open] summary { color: #eb5518; }
.reference-faq details[open] summary::after { content: "−"; }
.reference-faq p { margin: 16px 20px 0 0; }
body[data-page="home"] .site-footer { background: #232323; }
body[data-page="home"] .footer-brand-kicker, body[data-page="home"] .footer-brand-copy, body[data-page="home"] .footer-contact-label, body[data-page="home"] .footer-bottom { color: #aaa; }
body[data-page="home"] .campaign-entry { background: #eb5518; border-color: #eb5518; color: #fff; }
@media(min-width:1600px) { .reference-hero__word { font-size: 230px; } .reference-hero { height: 820px; } .reference-service { height: 560px; } }
@media(max-width:1050px) { .reference-hero__word { font-size: 120px; } .reference-service { height: 380px; } .reference-hero__caption { max-width: 200px; } .reference-hero__caption p { font-size: 17px; } .reference-process__track article { flex-basis: 65%; } }
@media(max-width:680px) {
 .reference-hero { height: 600px; min-height: 540px; max-height: none; }
 .reference-hero__art { top: 105px; width: 140%; max-width: none; left: -20%; height: 365px; object-fit: contain; object-position: center; }
 .reference-hero__word { font-size: 66px; top: 27%; }
 .reference-hero__caption { left: 20px; bottom: 24px; max-width: 170px; }
 .reference-hero__caption h1 { font-size: 21px; }
 .reference-hero__caption p { font-size: 14px; }
 .reference-hero__links { right: 20px; bottom: 24px; gap: 10px; }
 .reference-hero__links button { font-size: 12px; }
 .reference-services { gap: 8px; padding: 8px; }
 .reference-service { height: 270px; }
 .reference-service__copy { left: 10px; right: 10px; bottom: 18px; }
 .reference-service__copy h2 { font-size: 18px; }
 .reference-service__copy p { font-size: 12px; line-height: 1.6; }
 .reference-service__copy button { font-size: 11px; padding: 7px 11px; gap: 6px; }
 .reference-service--record > img { padding: 0; }
 .reference-service--record .reference-service__copy { top: auto; bottom: 18px; }
 .reference-process { padding-top: 60px; }
 .reference-process h2 { font-size: 23px; }
 .reference-process > header p { font-size: 14px; }
 .reference-process__track article { flex-basis: 86%; height: 310px; padding: 22px; }
 .reference-links { gap: 12px; grid-template-columns: 1fr; margin: 0 auto 60px; }
 .reference-links__head { margin-bottom: 16px; padding: 0; }
 #page-home .reference-links__head h2 { font-size: 26px; line-height: 1.4; }
 .reference-links__head p { margin-top: 10px; font-size: 14px; line-height: 1.7; }
 .reference-links > a, .reference-links > button { min-height: 280px; }
 .reference-about { grid-template-columns: 1fr; gap: 30px; padding: 55px 24px; }
 body[data-page="home"] .site-header .site-nav { background: #eee; }
}
@media(prefers-reduced-motion:reduce) { #page-home * { transition: none !important; scroll-behavior: auto !important; } }
body[data-page="home"] #wowoOfflineBanner { display: none; }
body[data-page="home"].has-offline-banner { padding-top: 0 !important; }
body[data-page="home"].has-offline-banner .site-header { top: 0 !important; }
body[data-page="home"] #page-home { background: #fff; }
#page-home .reference-process, #page-home .reference-links { background: #fff; }
#page-home :is(h1,h2,h3) { color: #333; }
#page-home .reference-service h2,
#page-home .reference-process__track h3,
#page-home .reference-links > a h2,
#page-home .reference-links > button h2 { color: #fff !important; }
body[data-page="home"] .site-footer .footer-contact-link { color: #fff !important; border-color: #777; }