/* Shared service spacing; download.css supplies the download-specific layout. */
.service-page{padding:76px 0 60px;min-height:calc(100svh - var(--header));position:relative}
.service-heading{position:relative;padding-bottom:40px;z-index:1}
.service-heading .eyebrow{color:#947456;margin-bottom:14px}
.service-heading :is(h1,h2:where([data-page-heading])){font-size:clamp(38px,4vw,57px);letter-spacing:.12em;margin-bottom:18px}
.service-heading>p:last-child{max-width:630px;color:var(--muted);line-height:1.9;font-size:18px}

.contact-page{--contact-slot:clamp(360px,calc(100svh - var(--header) - 218px),600px);padding:40px 0 32px;min-height:0;max-width:1360px}
.contact-composition{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(48px,7vw,116px);align-items:center;padding-left:52px}
.contact-intro{padding:0;min-width:0}
.contact-intro :is(h1,h2:where([data-page-heading])){font-size:clamp(32px,3.733333vw,58.666667px);line-height:1.48;letter-spacing:.025em;font-weight:400;margin:0;width:calc(200% / 3);max-width:340px}
.contact-intro :is(h1,h2:where([data-page-heading]))>span{display:block;white-space:nowrap}
.contact-art{display:none;position:relative;width:100%;aspect-ratio:409/271;overflow:hidden}
/* Frame only the transparent margins of the Owner's original 600 x 425 canvas. */
.contact-art img{position:absolute;display:block;width:146.699267%;height:auto;max-width:none;left:-21.760391%;top:-28.782288%;transition:filter .8s cubic-bezier(.165,.84,.44,1)}
#contact-title.art-ready .contact-art{display:block}
#contact-title.art-ready>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:normal}
.contact-details{--contact-font:"Microsoft YaHei","Microsoft YaHei UI","PingFang SC",sans-serif;min-width:0;width:calc(200% / 3);margin-left:auto;padding-top:0;font-family:var(--contact-font)}
.contact-channel{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;align-items:baseline;padding:24px 0;min-width:0}
.contact-channel:first-child{padding-top:0;padding-bottom:29.333333px}
.contact-channel+.contact-channel{border-top:1px solid #d6dacd}
.contact-channel h2{font:16px/1.8 var(--contact-font);letter-spacing:.055em;color:#747c70}
.contact-accounts,.contact-address{min-width:0}
.contact-address+.contact-address{margin-top:14.666667px}
.contact-copy{display:inline-flex;align-items:center;gap:12px;min-width:0;max-width:100%;min-height:44px;padding:2px 0;font:400 clamp(16px,1.266667vw,19.333333px)/1.6 var(--contact-font);letter-spacing:0;text-align:left;color:var(--ink);cursor:pointer;transition:color .18s ease}
.contact-copy>span{min-width:0;overflow-wrap:anywhere;user-select:text;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;text-decoration-thickness:1px;transition:text-decoration-color .18s ease}
.contact-copy:hover{color:#6b755c}
.contact-copy:hover>span{text-decoration-color:#b1b7a4}
.contact-icon{display:block;width:14.666667px;height:14.666667px;flex:none;color:#95836c}
.contact-account-row{display:flex;align-items:center;gap:10px}
.contact-qr-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;padding:0;border-radius:4px;transition:background-color .18s ease;cursor:pointer}
.contact-qr-button:hover{background:#e9e9de}
.contact-copy:focus-visible,.contact-qr-button:focus-visible{outline:2px solid var(--red);outline-offset:5px}
.contact-status{min-height:28px;margin:0 0 0 92px;font-size:16px;color:#80674f;line-height:1.8;overflow-wrap:anywhere}

/* Keep the native dialog open until its exit transition has finished. */
#contact-qr{color:var(--ink);background:var(--paper);border:1px solid #c6c8bb;box-shadow:0 24px 70px #273a3230;padding:20px 25px 22px;width:min(440px,calc(100vw - 30px));max-height:calc(100svh - 30px);overflow:auto;opacity:0;transform:translateY(12px) scale(.985);transition:opacity .35s var(--ease),transform .35s var(--ease)}
#contact-qr[data-motion=open]{opacity:1;transform:translateY(0) scale(1)}
#contact-qr[data-motion=closing]{transition-duration:.3s}
#contact-qr::backdrop{background:#25372e00;backdrop-filter:blur(0);transition:background-color .35s var(--ease),backdrop-filter .35s var(--ease)}
#contact-qr[data-motion=open]::backdrop{background:#25372e80;backdrop-filter:blur(4px)}
#contact-qr[data-motion=closing]::backdrop{transition-duration:.3s}
.qr-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.qr-heading h2{font-size:26px}.qr-heading button{font:30px/1 sans-serif;width:44px;height:44px}
#qr-note,.qr-mobile-hint{font-size:14px;color:var(--muted);line-height:1.8;margin:10px 0}
#contact-qr img{display:block;max-height:54svh;width:auto;max-width:100%;height:auto;object-fit:contain;margin:15px auto;background:white}

/* One composition: scroll the right column while the original greeting stays put. */
#contact-view{position:relative;isolation:isolate;background:var(--paper)}
#contact-view::before{content:"";position:absolute;inset:0;background:#314b43;opacity:0;z-index:0;pointer-events:none;transition:opacity .8s cubic-bezier(.165,.84,.44,1)}
#contact-view[data-contact-panel=codes]::before{opacity:1}
.contact-page{position:relative;z-index:1}
.contact-intro :is(h1,h2:where([data-page-heading])),.contact-ruler{transition:color .8s cubic-bezier(.165,.84,.44,1)}
#contact-view[data-contact-panel=codes] .contact-intro :is(h1,h2:where([data-page-heading])),#contact-view[data-contact-panel=codes] .contact-ruler{color:#f7f4ed}
#contact-view[data-contact-panel=codes] .contact-art img{filter:brightness(0) invert(96%) sepia(10%) saturate(264%) hue-rotate(344deg)}
.contact-ruler{position:absolute;left:0;top:50%;transform:translateY(-50%);width:28px;height:clamp(180px,32svh,300px);color:var(--ink);z-index:2}
.contact-ruler-ticks{position:absolute;left:19px;top:22px;bottom:22px;width:2px;background:repeating-linear-gradient(to bottom,currentColor 0 1px,transparent 1px 12px);opacity:.7}
.contact-ruler-marker{position:absolute;left:3px;top:calc(22px + (100% - 44px) * var(--contact-progress,0));width:0;height:0;border-top:3px solid transparent;border-bottom:3px solid transparent;border-left:5px solid currentColor;transform:translateY(-3px)}
.contact-ruler button{position:absolute;left:-8px;width:44px;height:44px;cursor:pointer;color:inherit}
.contact-ruler button:first-of-type{top:0}.contact-ruler button:last-of-type{bottom:0}
.contact-ruler button::after{content:"";position:absolute;width:9px;height:1px;left:23px;top:22px;background:currentColor}
.contact-ruler button:focus-visible{outline:1px solid currentColor;outline-offset:0}
.contact-port{height:var(--contact-slot);min-width:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;position:relative;overscroll-behavior-y:auto}
.contact-port::-webkit-scrollbar{display:none}
.contact-port:focus-visible{outline:1px solid #95836c;outline-offset:8px}
.contact-panel{height:100%;display:flex;align-items:center;min-width:0}
.contact-qr-panel{color:#f7f4ed}
.contact-code-page{width:100%;min-width:0;color:#f7f4ed}
.contact-code-content{width:100%;text-align:center}
.contact-code-content h2{font-size:clamp(22px,2vw,28px);line-height:1.4;font-weight:400;letter-spacing:.05em;margin-bottom:14px}
.contact-code-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0 auto;align-items:start}
.contact-code-card{margin:0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.contact-code-card figcaption{font:17px/1.4 "Microsoft YaHei","PingFang SC",sans-serif;letter-spacing:.06em}
.contact-code-open{display:flex;align-items:center;justify-content:center;max-width:100%;padding:6px;background:#fff;box-shadow:0 10px 30px #162c2433;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.contact-code-open img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(var(--contact-slot) - 176px);object-fit:contain}
.contact-code-open:hover{transform:translateY(-3px);box-shadow:0 16px 36px #162c244d}
.contact-code-card .contact-copy{color:#f7f4ed;justify-content:center;font-family:"Microsoft YaHei","PingFang SC",sans-serif}
.contact-code-card .contact-copy:hover>span{text-decoration-color:#f7f4ed80}
.contact-code-open:focus-visible,.contact-code-card .contact-copy:focus-visible{outline:2px solid #ede1b7;outline-offset:5px}
.contact-code-status{min-height:24px;margin:0;color:#e1e8dd;font:14px/1.7 "Microsoft YaHei","PingFang SC",sans-serif;overflow-wrap:anywhere}
/* Without enhancement both right-hand panels remain reachable by native scrolling. */
#contact-view:not([data-contact-motion]) .contact-qr-panel{background:#314b43}
#contact-view:not([data-contact-motion]) .contact-ruler{display:none}
body[data-active-scene=contact] .site-footer{padding:22px 0}
body[data-active-scene=contact] .site-stat-note{padding-top:8px;padding-bottom:14px}
body[data-active-scene=contact] #main{padding-bottom:0}

@media(max-width:1100px){
  .contact-page{--contact-slot:clamp(460px,calc(100svh - var(--header) - 218px),600px)}
  .contact-composition{gap:48px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .contact-channel{grid-template-columns:1fr;gap:5.333333px;padding:16.666667px 0}
  .contact-channel:first-child{padding-bottom:20px}
  .contact-copy{font-size:16px;gap:8px}
  .contact-status{margin-left:0}
}
@media(max-width:700px){
  .service-page{padding-top:40px;padding-bottom:38px}
  .service-heading{padding-bottom:29px}
  .service-heading :is(h1,h2:where([data-page-heading])){font-size:36px;margin-bottom:14px}
  .service-heading>p:last-child{font-size:16px}
  .contact-page{--contact-slot:420px;padding:30px 0 24px}
  .contact-composition{grid-template-columns:minmax(0,1fr);gap:28px;padding-left:32px}
  .contact-ruler{width:20px;height:180px;top:110px;transform:none}
  .contact-ruler-ticks{left:13px}.contact-ruler-marker{left:0}
  .contact-ruler button{left:-14px}
  .contact-intro{padding-bottom:0}
  .contact-intro :is(h1,h2:where([data-page-heading])){font-size:clamp(24px,5.8vw,39.333333px);margin:0;max-width:286.666667px}
  .contact-details{width:100%;justify-self:stretch}
  .contact-channel{padding:17.333333px 0}
  .contact-channel:first-child{padding-bottom:18.666667px}
  .contact-address+.contact-address{margin-top:8px}
  .contact-status{margin-left:0}
  .contact-code-pair{gap:20px}
  .contact-code-content h2{margin-bottom:14px}
  .contact-code-open{padding:5px}
  .contact-code-card figcaption{font-size:16px}
  .contact-code-card .contact-copy{font-size:16px}
}
@media(max-width:380px){.contact-icon{width:12.666667px;height:12.666667px}.contact-intro :is(h1,h2:where([data-page-heading])){font-size:clamp(18.666667px,6.533333vw,24.666667px)}}
@media(prefers-reduced-motion:reduce){.contact-copy,.contact-copy>span,.contact-qr-button,#contact-qr,#contact-qr::backdrop,#contact-view::before,.contact-intro :is(h1,h2:where([data-page-heading])),.contact-art img,.contact-ruler,.contact-code-open{transition:none}.contact-code-open,#contact-qr{transform:none}}
@media(forced-colors:active){#contact-title.art-ready .contact-art{display:none}#contact-title.art-ready>span{position:static;width:auto;height:auto;clip-path:none;white-space:nowrap}.contact-channel+.contact-channel{border-color:CanvasText}.contact-icon{color:ButtonText}}
@media(forced-colors:active){#contact-view::before{display:none}.contact-code-page,.contact-code-card .contact-copy,.contact-code-status{color:CanvasText;background:Canvas}.contact-code-open{border:1px solid ButtonText}.contact-code-open img{forced-color-adjust:none}}
