/* Scoped restoration: source layout remains in common/css. */
html {scroll-behavior:smooth;scroll-padding-top:72px}
:focus-visible {outline:3px solid currentColor!important;outline-offset:4px}
button {font:inherit;cursor:pointer}
img {height:auto}
header .logo a {display:inline-flex;align-items:center;height:62px;color:#fff;font:14px Arial,sans-serif}
header .social {display:flex;gap:14px;align-items:center}
header .social a {font:bold 24px Georgia,serif;color:white;min-width:32px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.banner_sec .archive-note {font:12px/1.5 Arial,sans-serif;max-width:580px;padding:16px 0 0;color:#eee}
.banner_sec .flexslider ul.slides li {position:absolute;inset:0;opacity:0;transition:opacity 1s ease;display:block}
.banner_sec .flexslider ul.slides li:first-child {opacity:1}
.banner_sec .flexslider ul.slides li.is-current {opacity:1}
.banner_sec .flexslider ul.slides li:first-child:not(.is-current) {opacity:0}
.banner_sec.loading .flexslider ul.slides li:first-child {opacity:1}
.slider-control {position:absolute;bottom:16px;left:16px;z-index:5;border:1px solid #fff;border-radius:4px;background:#111b;color:#fff;padding:9px 12px;font:12px Arial,sans-serif}
.fa {font-style:normal;font-weight:bold;font-family:Arial,sans-serif;min-width:1em;text-align:center}
#portfoliolist .portfolio {display:inline-block}
#portfoliolist .portfolio[hidden] {display:none!important}
.twitter_sec .items li:focus-within .text {bottom:0;transform:translateY(0)}
.twitter_sec .filters button {font:inherit;letter-spacing:inherit;text-transform:inherit;background:transparent;min-height:44px}
.twitter_sec button.trigger {display:none;width:100%;padding:12px;background:transparent;color:#fff;border:1px solid #fff;text-align:left}
.filter-status {color:#ddd;text-align:center;margin:16px 0 0;font:13px Arial,sans-serif}
.archive-post {max-width:680px;margin:22px auto 46px;padding:22px;border:1px solid #ffffff66;border-radius:8px;color:#fff;font:15px/1.6 Arial,sans-serif;text-align:left;overflow-wrap:anywhere}
.archive-post p {margin:0 0 14px!important;padding:0!important;font:inherit!important;color:inherit!important}
.archive-post .post-note {font-size:13px!important;opacity:.85}
.archive-post a,.archive-post button {display:inline-block;color:#fff;background:transparent;padding:10px 14px;border:1px solid #fff;border-radius:4px;margin:4px 10px 0 0;font:14px/1.4 Arial,sans-serif;text-decoration:none}
.archive-post iframe {display:block;border:0;width:100%;max-width:100%;height:600px;background:white;margin:16px 0 0}
.archive-post .embed-status {font:12px/1.5 Arial,sans-serif;margin-top:12px!important}
#footer {padding:30px 20px;text-align:center;background:#111;color:#ccc;font:13px/1.6 Arial,sans-serif}
#footer p {margin-bottom:8px}#footer a {color:#fff;text-decoration:underline}
@media(max-width:767px){
html{scroll-padding-top:12px}
header .logo a{height:44px}
header{height:56px!important;min-height:56px!important}
header .logo{left:15px;top:5px}
header .social{margin:0;float:right}
.banner_sec{height:auto;min-height:590px}
.banner_sec .v-middle{padding:30px 18px 65px}
.banner_sec .archive-note{max-width:100%;font-size:11px;padding:15px 0 0}
.banner_sec .navigation{display:flex;justify-content:center;flex-wrap:wrap;gap:14px 8px}
.banner_sec .navigation li{width:30%;max-width:none;min-width:0;padding:0}
.banner_sec .navigation li span{display:block;font-size:10px;padding:0;min-height:0;background:none;letter-spacing:0}
.banner_sec .navigation li i{margin-top:8px;font-size:22px}
.twitter_sec button.trigger{display:block}
.twitter_sec .filters{display:none;top:48px}
.twitter_sec .filters.is-open{display:block}
.twitter_sec .filters li button{width:100%;text-align:left;padding:10px 14px}
.twitter_sec .items{margin:20px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;text-align:left}
.twitter_sec .items li{width:auto;margin:0;min-width:0}
.twitter_sec .items .inter{padding-bottom:0}
.twitter_sec .items .pic img{width:100%;aspect-ratio:1;object-fit:cover}
.twitter_sec .items .text{position:relative;bottom:auto;transform:none;height:auto;padding-bottom:36px;min-height:175px}
.twitter_sec .items .head{min-height:44px}
.twitter_sec .items .inner{padding:12px}
.twitter_sec .items li p{font:12px/1.5 Arial,sans-serif}
.twitter_sec .items li a.btn{padding:5px 10px;font-size:10px}
.archive-post{padding:16px;margin:20px 0 36px}
.archive-post iframe{height:440px}
.vines_sec .centering{max-width:100%;padding:0 20px 40px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Brief control feedback; keyboard and reduced-motion actions remain immediate. */
:root{--ease-out:cubic-bezier(0.23,1,0.32,1)}
.slider-control,.trigger,.filters button,.archive-post button{transition:transform 160ms var(--ease-out)}
.slider-control:not(:disabled):not(:focus-visible):active,.trigger:not(:disabled):not(:focus-visible):active,.filters button:not(:disabled):not(:focus-visible):active,.archive-post button:not(:disabled):not(:focus-visible):active{transform:scale(.97)}
:root[data-input="keyboard"]{scroll-behavior:auto}
:root[data-input="keyboard"] *, :root[data-input="keyboard"] *::before, :root[data-input="keyboard"] *::after{transition:none!important}
.banner_sec .flexslider ul.slides li{transition:opacity 250ms ease}
@media(min-width:768px){.twitter_sec .items .text{bottom:0;transform:translateY(calc(100% - 51px));transition:transform 200ms var(--ease-out)}.twitter_sec .items li:focus-within .text,.twitter_sec .items li.act .text{transform:none}}
@media(min-width:768px) and (hover:hover) and (pointer:fine){.twitter_sec .items li:hover .text{transform:none}}
@media(hover:hover) and (pointer:fine){.slider-control:hover,.archive-post button:not(:disabled):hover{opacity:.8}}
