/* Scoped agency sections. Device geometry and textures remain owned by device-viewer. */
body[data-page=home]{--gutter:clamp(24px,5vw,100px);background:#080f10}
body[data-page=home] .home-panel:not(.original-hero):not(.brand-story) h2{font-family:"Noto Serif TC","PMingLiU",serif;font-weight:500;letter-spacing:.04em;font-size:clamp(32px,3.2vw,52px)}
body[data-page=home] .home-panel .home-summary{color:#a4b5b2;font-size:16px;line-height:1.9}
body[data-page=home] .web-panel h2{font-size:46px}
body[data-page=home] .web-panel .home-summary{font-size:16px;line-height:2}
body[data-page=home] .web-panel .home-section-copy>.text-link:before{display:none}
.web-panel .text-link svg,.device-toolbar svg{width:22px;height:22px;flex:none}
.device-toolbar button{width:44px;height:44px}
.journal-entry h3 a{display:block;min-height:44px}
.water-ripple{position:absolute;z-index:0;inset:48% -12% -15% 26%;overflow:hidden;pointer-events:none;mask-image:linear-gradient(transparent,#000 30%,transparent)}
.water-ripple i{display:block;position:absolute;inset:15%;border:1px solid #12c9c035;border-radius:50%;box-shadow:0 0 12px #12c9c00c;transform:rotateX(62deg) scale(.6);opacity:0;animation:water-expand 11s linear infinite;animation-play-state:paused}
.water-ripple i:nth-child(2){animation-delay:-3.66s}.water-ripple i:nth-child(3){animation-delay:-7.33s}
.water-ripple.is-running i{animation-play-state:running}
@keyframes water-expand{0%{transform:rotateX(62deg) scale(.55);opacity:0}20%{opacity:.6}100%{transform:rotateX(62deg) scale(2.1);opacity:0}}
.web-layout{position:relative;z-index:1}
body[data-page=home] .systems-panel{background:#080f10;overflow:visible}
body[data-page=home] .systems-panel:before{display:none}
.systems-panel #system-grid{display:block;margin-top:0}
.solution-showcase{min-width:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch}
.solution-detail{min-width:0;display:flex;flex-direction:column;border:1px solid #294340;border-radius:3px;padding:18px;background:#0b1516;transition:border-color .25s,background .25s}
.solution-detail:is(:hover,:focus-within,.is-selected){border-color:var(--teal);background:#102421}
.solution-art{height:clamp(160px,23vh,250px);margin-bottom:16px}
.solution-art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 25px #0004)}
.solution-description{padding-top:16px;border-top:1px solid #35514f;display:flex;flex:1;flex-direction:column}
.solution-description h3{font-size:clamp(19px,1.5vw,24px);font-weight:500;line-height:1.5;margin:8px 0}
.solution-description p{font-size:14px;line-height:1.85;color:#a7b8b5}
.solution-description .solution-audience{font-size:11px;color:var(--teal);min-height:42px}
.solution-summary{min-height:78px}
.solution-description ul{display:flex;flex-wrap:wrap;gap:8px 12px;padding:16px 0;font-size:12px;color:#d2dcd9}
.solution-description li{border-left:1px solid var(--teal);padding-left:12px}
.solution-description .text-link{font-size:13px;min-height:44px;align-self:flex-start;margin-top:auto}
.solution-description .text-link svg{width:20px;height:20px;flex:none}
body[data-page=home] .journal-panel{background:#080f10}
.journal-columns{grid-template-columns:1.55fr 1fr;gap:5vw}
.journal-columns>div:last-child{border-left:1px solid #3b5250;padding-left:4vw}
.journal-column-title h3{font:500 21px/1.5 "Noto Serif TC",serif}
.journal-entry{padding-block:24px;align-items:start}
.journal-entry h3{font-family:"Noto Serif TC","PMingLiU",serif;font-size:21px;font-weight:500;line-height:1.65}
#home-blog .journal-entry:first-child h3{font-size:clamp(24px,2.1vw,34px)}
.journal-entry p{color:#9fb0ad}
.journal-entry a:hover{color:var(--teal)}
.conversation-empty{padding-top:20px}
.conversation-mark{font:96px/.7 Georgia,serif;color:#183c38;display:block;margin-block:12px}
.conversation-empty h3{font:500 clamp(22px,2vw,31px)/1.7 "Noto Serif TC",serif;margin-bottom:18px}
.conversation-empty p{font-size:14px;line-height:1.9;color:#a2b4b0}
.conversation-empty .text-link{font-size:13px;margin-top:20px}
#home-partners{margin-top:32px}
#home-partners .partner-logo{width:180px;height:80px}
#home-partners .partner-logo img{max-height:100%;max-width:100%;object-fit:contain}
.home-panels>#footer{scroll-snap-align:none;position:relative;margin:0;flex-shrink:0}
@media(min-width:1200px) and (min-height:760px) and (not (pointer:coarse)) and (prefers-reduced-motion:no-preference){
 .systems-panel .home-section-top{margin-bottom:24px;max-width:none}
 .systems-panel .system-more{margin-top:16px;align-self:start}
 .home-panels>#footer{min-height:0}
 .journal-panel .journal-entry{padding-block:18px}
 .journal-panel #home-partners{margin-top:16px}
}
@media(max-width:1199px),(max-height:759px),(pointer:coarse),(prefers-reduced-motion:reduce){
 body[data-page=home]{height:auto;overflow:visible;padding-top:var(--header-height,74px)}
 .home-panels{height:auto;overflow:visible;position:static;touch-action:pan-y;scroll-snap-type:none}
 .section-dots{display:none}
 .home-panel{min-height:0;padding-block:72px;scroll-margin-top:80px}
 .original-hero{height:auto;padding-top:0}.original-hero-main{padding-block:55px}
 body[data-page=home] .home-panel.web-panel{padding-block:72px}
 body[data-page=home] .web-panel .real-device-stage{height:auto;aspect-ratio:1.5}
 body[data-page=home] .web-panel .device-toolbar{position:static}
}
@media(max-width:1199px){.solution-showcase{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}
@media(min-width:1200px) and (max-height:900px) and (min-height:760px){
 .systems-panel .home-section-top{margin-bottom:18px}
 .systems-panel .home-section-top h2{line-height:1.3}
 .systems-panel .home-section-top .home-summary{margin-top:12px}
 .solution-detail{padding:14px}
 .solution-art{height:130px;margin-bottom:12px}
 .solution-description{padding-top:12px}
 .solution-description .solution-audience{min-height:26px}
 .solution-summary{min-height:52px}
 .solution-description ul{padding-block:10px}
}
@media(max-width:899px){
 .systems-panel #system-grid{display:block}
 .solution-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
 .solution-detail{padding:22px}
 .solution-art{height:200px}
 .solution-description h3{font-size:22px}
 .journal-columns{grid-template-columns:1fr 1fr;gap:32px}
 .journal-columns>div:last-child{padding-left:24px}
 .water-ripple{inset:52% -12% 0 0}
}
@media(max-width:599px){
 body[data-page=home] .home-panel:not(.original-hero):not(.brand-story) h2{font-size:34px}
 body[data-page=home] .home-panel .home-summary{font-size:14px}
 body[data-page=home] .web-panel h2{font-size:36px}
 .solution-showcase{grid-template-columns:1fr;gap:20px}
 .solution-detail{padding:24px}
 .solution-art{height:220px}
 .journal-columns{grid-template-columns:1fr;gap:42px}
 .journal-columns>div:last-child{border-left:0;padding-left:0}
 .journal-entry h3,#home-blog .journal-entry:first-child h3{font-size:23px}
 #home-partners .partner-logo{width:145px;height:70px}
 .hero-services{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
 .original-copy h1{font-size:clamp(38px,8.5vw,56px)}
 .home-actions{gap:12px;flex-wrap:wrap}
 .home-button{padding:12px 16px}
}
@media(prefers-reduced-motion:reduce){.water-ripple i{animation:none;opacity:.2;transform:rotateX(62deg) scale(1)}.solution-detail,.portfolio-image>img{transition:none}}
