/* Standalone Videos page only; shared Home components retain their rules. */
.videos-page { background:#F7F6F2; color:#171717; }
.videos-page__inner { width:calc(100% - 32px); max-width:1240px; margin-inline:auto; padding:32px 0 40px; }
.videos-intro { max-width:820px; margin-bottom:28px; }
.videos-intro__eyebrow, .videos-cta__eyebrow { margin:0 0 12px; font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.videos-intro__eyebrow { color:var(--action-primary); }
.videos-intro h1 { margin:0 0 16px; max-width:800px; font-size:clamp(2rem, 3.2vw, 2.875rem); line-height:1.12; font-weight:700; letter-spacing:-.025em; }
.videos-intro__text { max-width:700px; margin:0; color:#666A67; font-size:1rem; line-height:1.6; }
.videos-tools { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,260px); align-items:end; gap:16px; }
.videos-tools > div { min-width:0; }
.videos-tools label { display:block; margin-bottom:8px; color:#454A46; font-size:.8125rem; font-weight:600; }
.videos-search__field { position:relative; }
.videos-search__field > svg { position:absolute; left:16px; top:12px; color:#666A67; pointer-events:none; }
.videos-tools input, .videos-tools select { display:block; width:100%; min-width:0; height:44px; border:1px solid #DCDDD7; border-radius:10px; background:#FFF; color:#171717; padding:8px 14px; }
.videos-tools input { padding-left:46px; }
.videos-tools input::placeholder { color:#767B77; opacity:1; }
.videos-filters { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.videos-filter { min-height:var(--button-height, 40px); max-width:100%; padding:8px 18px; border:1px solid #DCDDD7; border-radius:10px; background:#FFF; color:#555B56; font-size:.875rem; font-weight:600; transition:background-color .22s ease,color .22s ease,border-color .22s ease; }
.videos-filter.is-active { border-color:var(--action-primary); background:var(--action-primary); color:#FFF; }
.videos-count { margin:20px 0 16px; color:#666A67; font-size:.875rem; }
.videos-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; align-items:stretch; }
.videos-card { position:relative; display:flex; flex-direction:column; min-width:0; border:1px solid #E6E6E0; border-radius:16px; background:#FFF; overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,.06); transition:transform .22s ease,box-shadow .22s ease; }
.videos-card__thumbnail { position:relative; flex-shrink:0; width:100%; aspect-ratio:16/9; overflow:hidden; background:#173A24; }
.videos-card__thumbnail > img { width:100%; height:100%; object-fit:cover; transition:transform .22s ease; }
.videos-card__play { position:absolute; top:50%; left:50%; width:62px; height:62px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#FFF; color:#D90416; box-shadow:0 4px 18px rgba(0,0,0,.15); transform:translate(-50%,-50%); transition:transform .22s ease; }
.videos-card__play svg { flex:none; }
.videos-card__duration { position:absolute; bottom:12px; right:12px; border-radius:5px; background:rgba(23,23,23,.84); padding:3px 7px; color:#FFF; font-size:.75rem; font-variant-numeric:tabular-nums; }
.videos-card__content { flex:1; min-width:0; padding:20px; }
.videos-card__category { display:inline-block; max-width:100%; margin-bottom:12px; padding:4px 9px; border-radius:5px; background:rgba(23,58,36,.06); color:#173A24; font-size:.6875rem; font-weight:600; letter-spacing:.045em; text-transform:uppercase; }
.videos-card .videos-card__title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.8em; margin:0 0 8px; font-size:1.125rem; line-height:1.4; font-weight:700; color:#171717; }
.videos-card__description { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; margin:0; color:#666A67; font-size:.875rem; line-height:1.65; }
.videos-card__trigger { position:absolute; inset:0; z-index:2; width:100%; height:100%; padding:0; border:0; border-radius:inherit; background:transparent; color:var(--action-primary); }
.videos-card__trigger:focus-visible { outline:3px solid var(--action-primary); outline-offset:-4px; }
.videos-page :is(input,select,.videos-filter,.videos-empty button):focus-visible { outline:3px solid var(--action-primary); outline-offset:3px; }
.videos-empty { padding:40px 20px; text-align:center; border-radius:16px; background:#FFF; }
.videos-empty h2 { font-size:1.35rem; }
.videos-empty p { color:#666A67; }
.videos-empty button { min-height:var(--button-height, 40px); padding:8px 18px; border:0; border-radius:8px; background:var(--action-primary); color:#FFF; font-size:.875rem; font-weight:600; }
.videos-empty button:hover { background:var(--action-primary-hover); }
.videos-cta { position:relative; isolation:isolate; background:#173A24; color:#FFF; overflow:hidden; }
.videos-cta__background { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.videos-cta::before { position:absolute; z-index:-1; inset:0; content:""; background:linear-gradient(90deg,rgba(11,36,20,.94),rgba(13,43,25,.82) 50%,rgba(13,43,25,.5)); }
.videos-cta__inner { width:calc(100% - 32px); max-width:1240px; margin-inline:auto; padding:48px 0; }
.videos-cta h2 { max-width:740px; margin:0 0 16px; color:#FFF; font-size:clamp(1.75rem,2.6vw,2.375rem); line-height:1.15; font-weight:700; letter-spacing:-.02em; }
.videos-cta__text { max-width:620px; margin:0 0 20px; color:rgba(255,255,255,.88); line-height:1.6; }
.videos-cta__button { display:inline-flex; align-items:center; justify-content:center; gap:10px; max-width:100%; min-height:var(--button-height, 40px); padding:8px 18px; border-radius:8px; background:var(--action-primary); color:#FFF; font-size:.875rem; line-height:1.4; text-decoration:none; font-weight:700; transition:background-color .22s ease; }
.videos-cta__button:focus-visible { outline:3px solid #FFF; outline-offset:4px; }
@media (hover:hover) and (pointer:fine) {
    .videos-filter:not(.is-active):hover { border-color:#B7BCB5; background:#EDEFE9; color:#173A24; }
    .videos-card:hover { transform:translateY(-3px); box-shadow:0 12px 28px rgba(0,0,0,.09); }
    .videos-card:hover .videos-card__thumbnail > img { transform:scale(1.02); }
    .videos-card:hover .videos-card__play { transform:translate(-50%,-50%) scale(1.06); }
    .videos-cta__button:hover { background:var(--action-primary-hover); }
}
@media (min-width:640px) {
    .videos-page__inner, .videos-cta__inner { width:calc(100% - 64px); }
    .videos-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
    .videos-page__inner { padding-top:40px; padding-bottom:48px; }
    .videos-cta__inner { padding-block:56px; }
}
@media (min-width:1000px) {
    .videos-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
    .videos-page__inner { padding-top:48px; padding-bottom:56px; }
    .videos-cta__inner { padding-block:64px; }
}
@media (max-width:479px) {
    .videos-tools { grid-template-columns:minmax(0,1fr); gap:16px; }
    .videos-intro { margin-bottom:24px; }
    .videos-card__content { padding:20px; }
    .videos-filter { padding-inline:16px; }
}
@media (prefers-reduced-motion:reduce) {
    .videos-page *, .videos-page *::before, .videos-page *::after { transition:none !important; animation:none !important; }
    .videos-card:hover, .videos-card:hover .videos-card__thumbnail > img { transform:none; }
    .videos-card:hover .videos-card__play { transform:translate(-50%,-50%); }
}
