.category-archive-page{--hero-accent: #4e4e4e;--hero-surface: #f3f3f3;--page-pattern: linear-gradient(90deg, rgba(78, 78, 78, .025) .0625rem, transparent .0625rem), linear-gradient(rgba(78, 78, 78, .025) .0625rem, transparent .0625rem);--page-pattern-size: 1.75rem 1.75rem;--page-orb: radial-gradient(circle at 18% 20%, rgba(78, 78, 78, .05), transparent 28%), radial-gradient(circle at 82% 14%, rgba(78, 78, 78, .035), transparent 24%);position:relative;background:var(--white);isolation:isolate;overflow-x:clip}.category-archive-page.category-archive--hiking{--hero-accent: #285943;--hero-surface: #edf5ef;--page-pattern: linear-gradient( color-mix(in srgb, var(--white) 72%, transparent), color-mix(in srgb, var(--white) 72%, transparent) ), url(/assets/hiking-contours.png);--page-pattern-size: auto, 58rem auto;--page-orb: radial-gradient(circle at 16% 16%, rgba(40, 89, 67, .11), transparent 26%), radial-gradient(circle at 85% 24%, rgba(40, 89, 67, .075), transparent 22%)}.category-archive-page.category-archive--web{--hero-accent: #1f4b99;--hero-surface: #eef4ff;--page-pattern: linear-gradient(90deg, rgba(31, 75, 153, .065) .0625rem, transparent .0625rem), linear-gradient(rgba(31, 75, 153, .065) .0625rem, transparent .0625rem), radial-gradient(circle at 25% 35%, rgba(31, 75, 153, .11) .125rem, transparent .1875rem), radial-gradient(circle at 75% 62%, rgba(31, 75, 153, .085) .125rem, transparent .1875rem);--page-pattern-size: 2rem 2rem, 2rem 2rem, 14rem 14rem, 18rem 18rem;--page-orb: linear-gradient(135deg, rgba(31, 75, 153, .06), transparent 42%), radial-gradient(circle at 86% 16%, rgba(31, 75, 153, .055), transparent 18%)}.category-archive-page.category-archive--gadget{--hero-accent: #7a4a19;--hero-surface: #fff4e8;--page-pattern: radial-gradient(circle at center, rgba(122, 74, 25, .075) .0625rem, transparent .125rem), repeating-radial-gradient( circle at 78% 20%, rgba(122, 74, 25, .07) 0, rgba(122, 74, 25, .07) .0625rem, transparent .0625rem, transparent 1rem );--page-pattern-size: 1.5rem 1.5rem, 9rem 9rem;--page-orb: radial-gradient(circle at 18% 18%, rgba(122, 74, 25, .07), transparent 22%), radial-gradient(circle at 84% 76%, rgba(122, 74, 25, .055), transparent 18%)}.category-archive-page.category-archive--camp{--hero-accent: #5d4b2a;--hero-surface: #f7f1e7;--page-pattern: linear-gradient(120deg, rgba(93, 75, 42, .05) 0%, transparent 32%), linear-gradient(60deg, transparent 68%, rgba(93, 75, 42, .045) 100%), repeating-linear-gradient( 135deg, rgba(93, 75, 42, .06) 0, rgba(93, 75, 42, .06) .0625rem, transparent .0625rem, transparent 1rem );--page-pattern-size: 100% 100%, 100% 100%, 3rem 3rem;--page-orb: radial-gradient(circle at 14% 20%, rgba(93, 75, 42, .07), transparent 24%), radial-gradient(circle at 84% 18%, rgba(93, 75, 42, .055), transparent 20%)}.category-archive-page.category-archive--social{--hero-accent: #7a2f44;--hero-surface: #fbecf0;--page-pattern: repeating-radial-gradient( circle at 24% 18%, rgba(122, 47, 68, .065) 0, rgba(122, 47, 68, .065) .0625rem, transparent .0625rem, transparent 1.25rem ), repeating-radial-gradient( circle at 80% 72%, rgba(122, 47, 68, .055) 0, rgba(122, 47, 68, .055) .0625rem, transparent .0625rem, transparent 1rem );--page-pattern-size: 12rem 12rem, 10rem 10rem;--page-orb: radial-gradient(circle at 20% 22%, rgba(122, 47, 68, .07), transparent 22%), radial-gradient(circle at 84% 14%, rgba(122, 47, 68, .06), transparent 20%)}.category-archive-page.category-archive--other{--hero-accent: #4e4e4e;--hero-surface: #f3f3f3;--page-pattern: repeating-linear-gradient( 45deg, rgba(78, 78, 78, .045) 0, rgba(78, 78, 78, .045) .0625rem, transparent .0625rem, transparent 1.25rem ), repeating-linear-gradient( -45deg, rgba(78, 78, 78, .04) 0, rgba(78, 78, 78, .04) .0625rem, transparent .0625rem, transparent 1.5rem );--page-pattern-size: 3rem 3rem, 3rem 3rem;--page-orb: radial-gradient(circle at 16% 18%, rgba(78, 78, 78, .07), transparent 22%), radial-gradient(circle at 82% 80%, rgba(78, 78, 78, .05), transparent 18%)}.category-archive-page:before,.category-archive-page:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1}.category-archive-page:before{background-image:var(--page-pattern);background-size:var(--page-pattern-size);background-position:center top;background-repeat:repeat;opacity:.68;animation:categoryBackgroundDrift 24s ease-in-out infinite alternate}.category-archive-page:after{background-image:var(--page-orb);background-repeat:no-repeat;opacity:1;animation:categoryBackgroundFloat 18s ease-in-out infinite alternate}.category-archive-page .category-archive-main,.category-archive-page .l-footer{position:relative;z-index:1}.category-archive-page .l-header{position:relative;z-index:200}.category-archive-main{max-width:var(--max);margin:0 auto;padding:var(--page-block) var(--pad) var(--page-block-lg)}.hero{display:grid;grid-template-columns:minmax(0,1.375fr) minmax(18rem,.75fr);gap:1.5rem;margin-bottom:2rem}.hero-main,.hero-meta{border:.0625rem solid var(--g200);background:var(--white)}.hero-main{padding:clamp(1.5rem,4vw,2.75rem);background:linear-gradient(180deg,color-mix(in srgb,var(--white) 72%,transparent),color-mix(in srgb,var(--white) 96%,transparent)),radial-gradient(circle at top right,color-mix(in srgb,var(--hero-accent) 14%,var(--white)) 0%,transparent 38%),var(--hero-surface)}.hero-main__eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.125rem;text-transform:uppercase;color:var(--hero-accent);margin-bottom:1rem}.hero-main__lead{max-width:42rem;margin-top:1.25rem;color:var(--g700);font-size:1rem;line-height:1.9}.hero-main__focus{margin-top:1rem;padding-top:1rem;border-top:.0625rem solid color-mix(in srgb,var(--hero-accent) 18%,var(--white));color:var(--g600);font-size:1rem;line-height:1.8}.hero-meta{padding:1.5rem;display:flex;flex-direction:column;gap:1.25rem}.category-title{display:grid;gap:.375rem;margin:0}.category-title__en{font-family:var(--display-font);font-size:clamp(2rem,4vw,3rem);font-style:italic;font-weight:650;letter-spacing:-.02em;line-height:.95}.category-title__ja{color:var(--g600);font-size:.875rem;font-weight:700;letter-spacing:.125rem;line-height:1.55}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.0625rem;background:var(--g200);overflow:hidden}.stats__item{background:var(--white);padding:1rem}.stats__label{font-size:.75rem;letter-spacing:.125rem;text-transform:uppercase;color:var(--g400);margin-bottom:.25rem}.stats__value{font-size:1.25rem;font-weight:700;line-height:1.4}.tags{display:flex;flex-wrap:wrap;gap:.5rem}.tags__button{display:inline-flex;gap:.375rem;align-items:center;padding:.375rem .625rem;border:.0625rem solid transparent;border-radius:999rem;background:var(--hero-surface);color:var(--hero-accent);font-size:.75rem;font-weight:600;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease}.tags__button:hover,.tags__button:focus-visible,.tags__button.is-active{border-color:color-mix(in srgb,var(--hero-accent) 28%,transparent);background:color-mix(in srgb,var(--hero-accent) 12%,var(--hero-surface))}.tags__button small{color:inherit}.archive-card__subtitle,.archive-card__meta,.empty{color:var(--g600)}.archive-card__subtitle{margin-bottom:.5rem;font-size:.875rem;line-height:1.75;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.archive-card__meta,.empty{font-size:.875rem}.archive-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.archive-card{position:relative;border:.0625rem solid var(--g200);border-radius:1rem;background:var(--white);overflow:hidden;min-height:10rem;transition:border-color .18s ease,box-shadow .18s ease}.archive-card:focus-within{border-color:#70b2fff2;box-shadow:inset 0 0 0 .125rem #70b2fff2,0 0 0 .25rem #70b2ff38}.archive-card a{display:grid;grid-template-columns:14rem minmax(0,1fr);gap:0;color:inherit;min-height:10rem}.archive-card a:focus-visible{box-shadow:none;border-radius:0}.archive-card__media{position:relative;min-height:0;height:100%;overflow:hidden;background:var(--hero-surface)}.archive-card__media img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .28s ease}.archive-card:hover .archive-card__media img,.archive-card:focus-within .archive-card__media img{transform:scale(1.03)}.archive-card__title{font-family:var(--font);font-size:1.125rem;font-weight:500;line-height:1.5;margin-bottom:.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.archive-card a>div:last-child{padding:1.125rem 1.125rem 1.125rem 1rem;display:flex;flex-direction:column;justify-content:center;min-height:100%;min-width:0}.archive-card__meta{margin-top:auto}@keyframes categoryBackgroundDrift{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(0,-1.25rem,0) scale(1.015)}}@keyframes categoryBackgroundFloat{0%{transform:translateZ(0)}to{transform:translate3d(1rem,-.75rem,0)}}@media(max-width:73.75rem){.hero{grid-template-columns:1fr}.archive-card{min-height:0}.archive-card a{grid-template-columns:1fr;gap:0;min-height:0}.archive-card__media{aspect-ratio:16/10;min-height:0;height:auto}.archive-card a>div:last-child{padding:1rem 1rem 1.125rem}.category-archive-page:before,.category-archive-page:after{animation-duration:0s}}@media(max-width:48rem){.archive-grid{grid-template-columns:1fr}}:root[data-theme=dark] .category-archive-page{--hero-surface: color-mix(in srgb, var(--color-bg-subtle) 78%, var(--color-bg-surface));--page-pattern: linear-gradient(90deg, rgba(255, 255, 255, .025) .0625rem, transparent .0625rem), linear-gradient(rgba(255, 255, 255, .025) .0625rem, transparent .0625rem);--page-orb: radial-gradient(circle at 18% 20%, color-mix(in srgb, var(--hero-accent) 22%, transparent), transparent 28%), radial-gradient(circle at 82% 14%, color-mix(in srgb, var(--hero-accent) 16%, transparent), transparent 24%)}:root[data-theme=dark] .category-archive-page.category-archive--hiking{--hero-surface: color-mix(in srgb, #163225 48%, var(--color-bg-surface));--page-pattern: linear-gradient( color-mix(in srgb, var(--color-bg-surface) 98%, transparent), color-mix(in srgb, var(--color-bg-surface) 80%, transparent) ), url(/assets/hiking-contours.png);--page-orb: radial-gradient(circle at 16% 16%, color-mix(in srgb, #285943 14%, transparent), transparent 26%), radial-gradient(circle at 85% 24%, color-mix(in srgb, #285943 10%, transparent), transparent 22%)}:root[data-theme=dark] .category-archive-page .hero-main,:root[data-theme=dark] .category-archive-page .hero-meta,:root[data-theme=dark] .category-archive-page .archive-card,:root[data-theme=dark] .category-archive-page .stats__item{background:var(--color-bg-surface);border-color:var(--color-border-subtle)}:root[data-theme=dark] .category-archive-page .hero-main{background:linear-gradient(180deg,color-mix(in srgb,var(--color-bg-surface) 82%,transparent),color-mix(in srgb,var(--color-bg-surface) 96%,transparent)),radial-gradient(circle at top right,color-mix(in srgb,var(--hero-accent) 18%,var(--color-bg-surface)) 0%,transparent 38%),var(--hero-surface)}:root[data-theme=dark] .category-archive-page .hero-main__eyebrow,:root[data-theme=dark] .category-archive-page .tags__button{color:var(--color-text-strong)}:root[data-theme=dark] .category-archive-page .category-title__ja,:root[data-theme=dark] .category-archive-page .hero-main__focus,:root[data-theme=dark] .category-archive-page .archive-card__subtitle,:root[data-theme=dark] .category-archive-page .archive-card__meta,:root[data-theme=dark] .category-archive-page .empty{color:var(--color-text-secondary)}:root[data-theme=dark] .category-archive-page .hero-main__lead,:root[data-theme=dark] .category-archive-page .stats__value,:root[data-theme=dark] .category-archive-page .archive-card__title{color:var(--color-text-primary)}:root[data-theme=dark] .category-archive-page .stats{background:var(--color-border-subtle)}:root[data-theme=dark] .category-archive-page .stats__label{color:var(--color-text-muted)}:root[data-theme=dark] .category-archive-page .tags__button{background:color-mix(in srgb,var(--hero-accent) 22%,var(--color-bg-subtle))}:root[data-theme=dark] .category-archive-page .tags__button:hover,:root[data-theme=dark] .category-archive-page .tags__button:focus-visible,:root[data-theme=dark] .category-archive-page .tags__button.is-active{border-color:color-mix(in srgb,var(--hero-accent) 38%,transparent);background:color-mix(in srgb,var(--hero-accent) 30%,var(--color-bg-subtle))}