/* ════════════════════════════════════════════════════════
   さわかみアーカイブス — index.html 固有スタイル
════════════════════════════════════════════════════════ */


/* ════════════════════════════
   HERO
════════════════════════════ */
.hero {
  position:relative;height:100vh;min-height:700px;
  display:flex;align-items:flex-end;padding:0 5rem 7rem;overflow:hidden;
}
/* Video background */
.hero-video-bg {
  position:absolute;inset:0;z-index:0;
  overflow:hidden;
  background:#000;
}
.hero-video-bg video {
  position:absolute;
  top:50%;left:50%;
  min-width:100%;min-height:100%;
  width:auto;height:auto;
  transform:translate(-50%,-50%);
  object-fit:cover;
  filter:sepia(40%) brightness(.52) contrast(1.08) saturate(1.1);
  transition:opacity .6s ease;
}
.hero-video-bg video.fade-out { opacity:0; }

/* Canvas sits on top to add film damage FX */
#heroCanvas { position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none; }

/* Dramatic gradient overlays */
.hero-overlay {
  position:absolute;inset:0;z-index:2;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 60%,transparent 0%,rgba(42,34,24,.55) 85%),
    linear-gradient(to top,rgba(42,34,24,.92) 0%,rgba(42,34,24,.55) 35%,transparent 65%),
    linear-gradient(to right,rgba(42,34,24,.65) 0%,rgba(42,34,24,.08) 55%,transparent 70%);
}
/* Warm amber light leak */
.hero-light {
  position:absolute;z-index:3;
  width:700px;height:700px;top:5%;left:45%;
  background:radial-gradient(circle,rgba(200,146,42,.09) 0%,transparent 68%);
  animation:lightPulse 7s ease-in-out infinite;
  pointer-events:none;
}
@keyframes lightPulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}

/* Film strip right side */
.film-strip {
  position:absolute;
  right:30px;
  top:0;
  height:100%;
  width:240px;
  display:flex;
  flex-direction:column;
  gap:0;
  overflow:hidden;
  z-index:4;
  opacity:0;
  transform: rotate(6deg);
  background: black;
  animation: slideIn 1.5s ease 1s forwards;
}

/* パーフォレーション列（左右） */
.perf-rail {
  position: absolute;
  top: 0;
  width: 18px;
  height: 100%;
  overflow: hidden;
  z-index: 2;
  pointer-events: none;
}
.perf-rail.left  { left: 0; }
.perf-rail.right { right: 0; }

/* 穴ドットの連続トラック */
.perf-track {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  /* film-reelと同じアニメーション設定で完全同期 
  animation: filmScroll 78s linear infinite;*/
  will-change: transform;
}
.perf-track:hover { animation-play-state: paused; }

.perf-hole {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  background: #5e5e5e;
  margin: 12px 0;
}

.film-frame {
  flex-shrink:0;
  height:160px;
  border:1px solid rgba(212,168,71,.28);
  margin:3px 18px;
  position:relative;
  overflow:hidden;
  background-size:cover;
  background-position:center;
  filter:sepia(60%) brightness(.45) contrast(1.05) saturate(1.1);
  cursor:pointer;
  transition:filter .3s, border-color .3s;
}
.film-frame:hover {
  filter:sepia(20%) brightness(.7) contrast(1.05) saturate(1.2);
  border-color:rgba(212,168,71,.7);
}
.film-frame.active {
  filter:sepia(0%) brightness(.85) contrast(1.05) saturate(1.2);
  border-color:var(--amber);
  box-shadow:0 0 0 1px var(--amber);
}

/* ── フィルムリール：上から下へループ ── */
.film-reel {
  display:flex;
  flex-direction:column;
  /*animation:filmScroll 60s linear infinite;*/
  will-change:transform;
}
  /*.film-reel:hover { animation-play-state: paused; }*/
  .film-inner:has(.film-reel:hover) {animation-play-state: paused;}

.film-inner {
  animation:filmScroll 60s linear infinite;
}
@keyframes filmScroll {
  0%   { transform:translateY(-50%); }
  100% { transform:translateY(0); }
}

@keyframes slideIn {
  0% {
    transform: translateY(-180px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
  }
  40%,100% {
    opacity: 1;
  }
}

.hero-content {
  position:relative;z-index:5;max-width:820px;
}
.hero-eyebrow {
  font-family:'Space Mono',monospace;
  font-size:.8rem;letter-spacing:.55em;color:var(--amber);
  text-transform:uppercase;margin-bottom:2rem;opacity:0;animation:fadeUp .8s ease .4s forwards;
}
.hero-title {
  font-family:'Cormorant Garamond',serif;font-size:clamp(1.6rem,6vw,6rem);
  font-weight:300;line-height:1.0;margin-bottom:2.5rem;opacity:0;
  animation:fadeUp .9s ease .6s forwards;
  text-shadow:0 2px 50px rgba(0,0,0,.85);
}
.hero-title em { font-style:italic;color:var(--amber-light); }
.hero-title .ruled { display:inline-block;border-bottom:1px solid rgba(200,146,42,.65);padding-bottom:.1em; }
.hero-desc { font-size:.8rem;line-height:2.1;color:var(--silver);max-width:460px;margin-bottom:3rem;opacity:0;animation:fadeUp .9s ease .8s forwards;text-shadow:0 1px 20px rgba(0,0,0,.95); }
.hero-actions { display:flex;align-items:center;gap:3rem;opacity:0;animation:fadeUp .9s ease 1s forwards; }
.hero-year{position:absolute;left:8px;bottom:7rem;font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.3em;color:rgba(200,146,42,.5);writing-mode:vertical-rl;z-index:5;opacity:0;animation:fadeIn 1.2s ease 2s forwards;}

/* ─── STATS BAR ─── */
.stats-bar{border-top:1px solid rgba(212,168,71,.22);border-bottom:1px solid rgba(212,168,71,.22);padding:2.5rem 4rem;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(245,197,99,.035);}
.stat{text-align:center;padding:0 2rem;border-right:1px solid rgba(200,146,42,.12);}
.stat:last-child{border-right:none;}
.stat-num{font-family:'Cormorant Garamond',serif;font-size:2.8rem;font-weight:300;color:var(--amber-light);display:block;line-height:1;}
.stat-label{font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.3em;color:var(--text-muted);text-transform:uppercase;margin-top:.5rem;display:block;}

/* ─── SHARED SECTION LABELS ─── */
.section-title{font-family:'Cormorant Garamond',serif;font-size:clamp(1.3rem,4.5vw,4.2rem);font-weight:300;line-height:1.2;}
.section-title em{font-style:italic;color:var(--amber-light);}

/* ════════════════════════════
   ABOUT — image-backed
════════════════════════════ */
.about-section { position:relative;padding:12rem 5rem;overflow:hidden; 
  content-visibility: auto;
  contain-intrinsic-size: 0 600px;
}
.about-bg {
  position:absolute;inset:0;
  background:url('../img/archives-bg01.jpg') center/cover no-repeat;
  filter:sepia(33%) brightness(.8) contrast(1.05) saturate(1.08);
  transform:scale(1.06);
}
.about-overlay {
  position:absolute;inset:0;
  background:
    linear-gradient(to right,rgba(42,34,24,.96) 38%,rgba(42,34,24,.45) 100%),
    linear-gradient(to bottom,rgba(42,34,24,.6) 0%,transparent 25%,transparent 75%,rgba(42,34,24,.6) 100%);
}
.about-inner{position:relative;z-index:1;}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:7rem;align-items:center;margin-top:5rem;}
.about-visual{position:relative;aspect-ratio:4/3;}
.about-photo{width:100%;height:100%;object-fit:cover;filter:sepia(30%) brightness(.92) contrast(1.02) saturate(1.05);border:1px solid rgba(212,168,71,.22);}
.corner-mark{position:absolute;width:22px;height:22px;}
.corner-mark::before,.corner-mark::after{content:'';position:absolute;background:var(--amber);}
.corner-mark::before{width:100%;height:1px;top:0;left:0;}.corner-mark::after{width:1px;height:100%;top:0;left:0;}
.corner-mark.tr{top:10px;right:10px;transform:rotate(90deg);}
.corner-mark.br{bottom:10px;right:10px;transform:rotate(180deg);}
.corner-mark.bl{bottom:10px;left:10px;transform:rotate(270deg);}
.corner-mark.tl{top:10px;left:10px;}
.about-text{display:flex;flex-direction:column;gap:2rem;}
.about-text p{font-size: clamp(.95rem, .95rem, .95rem);line-height: 2;color:var(--silver);}
.about-text strong{color:var(--cream);font-weight:400;}
.about-divider{width:60px;height:1px;background:linear-gradient(to right,var(--amber),transparent);}

/* ════════════════════════════
   SERVICES — textured dark bg
════════════════════════════ */
.services-section{position:relative;padding:10rem 5rem;}
.services-bg{
  position:absolute;inset:0;
  background:url('../img/archives-bg03.jpg') center/cover no-repeat;
  filter:sepia(32%) brightness(1) contrast(1.2) saturate(1.05);
}
.services-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(42,34,24,.95) 0%,rgba(42,34,24,.84) 50%,rgba(42,34,24,.95) 100%);}
.services-inner{position:relative;z-index:1;}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:5rem;}
.service-card{background:rgba(54,44,32,.82);border:1px solid rgba(212,168,71,.12);padding:3.5rem 3rem;position:relative;transition:border-color .4s,background .4s;overflow:hidden;backdrop-filter:blur(4px);}
.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(to right,transparent,var(--amber),transparent);transform:scaleX(0);transition:transform .4s;}
.service-card:hover::before{transform:scaleX(1);}
.service-card:hover{border-color:rgba(212,168,71,.28);background:rgba(68,54,38,.88);}
.service-num{font-family:'Cormorant Garamond',serif;font-size:5rem;font-weight:300;color:rgba(212,168,71,.08);line-height:1;margin-bottom:-1.5rem;}
.service-icon{width:48px;height:48px;border:1px solid rgba(200,146,42,.28);display:flex;align-items:center;justify-content:center;margin-bottom:2rem;}
.service-icon svg{width:20px;height:20px;stroke:var(--amber);fill:none;stroke-width:1;}
.service-title{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:400;margin-bottom:1.2rem;}
.services-desc{font-size:.95rem;line-height:2;color:var(--text-muted);margin: 2rem auto 3rem;}
.service-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  margin-top: 2rem;

  font-family: 'Space Mono', monospace;
  font-size: .6rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  text-decoration: none;

  /* 👇 ここが重要（常時目立つ） */
  color: var(--amber-light);
  padding: .7rem 1.4rem;

  border: 1px solid rgba(212,168,71,.45);
  background: rgba(212,168,71,.08);

  box-shadow:
    0 0 0 1px rgba(212,168,71,.15),
    0 6px 18px rgba(0,0,0,.35);

  transition: all .35s ease;
  overflow: hidden;
}

/* 左アクセント強化 */
.service-link::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 3px;
  background: var(--amber);
  opacity: .9;
}

/* ホバーで“完成形”へ */
.service-link:hover {
  color: var(--sepia-dark);
  background: var(--amber);
  border-color: var(--amber);
  box-shadow:
    0 0 0 1px rgba(212,168,71,.4),
    0 10px 28px rgba(0,0,0,.5);
}

/* 矢印 */
.service-link::after {
  content: '→';
  font-size: .7rem;
  transition: transform .3s ease;
}

.service-link:hover::after {
  transform: translateX(6px);
}

.service-img {height: auto;width: 100%;margin-bottom: 12px;}

/* ════════════════════════════
   PROCESS — cinematic bg
════════════════════════════ */
.process-section{position:relative;padding:12rem 5rem;overflow:hidden;}
.process-bg{
  position:absolute;inset:0;
  background:url('../img/archives-bg02.jpg') center/cover no-repeat;
  filter:sepia(45%) brightness(.26) contrast(1.15) saturate(1.1);
  transform:scale(1.08);
}
.process-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(42,34,24,.98) 0%,rgba(42,34,24,.82) 50%,rgba(42,34,24,.98) 100%);}
.process-inner{position:relative;z-index:1;}
.process-timeline{position:relative;margin-top:6rem;padding-left:3rem;}
.process-line{position:absolute;left:0;top:0;bottom:0;width:1px;background:linear-gradient(to bottom,var(--amber) 0%,rgba(200,146,42,.1) 100%);}
.process-step{position:relative;padding:0 0 5rem 5rem;}
.process-step::before{content:'';position:absolute;left:-5px;top:8px;width:10px;height:10px;border:1px solid var(--amber);background:var(--sepia-dark);transform:rotate(45deg);transition:background .3s;}
.process-step:hover::before{background:var(--amber);}
.step-num{font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.3em;color:var(--amber);margin-bottom:1rem;}
.step-title{font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:400;margin-bottom:1rem;}
.step-desc{font-size:.9rem;line-height:2.1;color:var(--silver);max-width:520px;}
.process-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 8rem;}

/* ════════════════════════════
   QUOTE BANNER — full bleed
════════════════════════════ */
.quote-banner{position:relative;padding:11rem 5rem;overflow:hidden;text-align:center;}
.quote-bg{
  position:absolute;inset:0;
  background:url('../img/archives-bg01.jpg') center/cover no-repeat;
  filter:sepia(50%) brightness(.35) contrast(1.15) saturate(1.08);
  animation:qBgZoom 22s ease-in-out infinite alternate;
}
@keyframes qBgZoom{from{transform:scale(1.0)}to{transform:scale(1.1)}}
.quote-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(42,34,24,.48) 0%,rgba(42,34,24,.88) 100%);}
.quote-inner{position:relative;z-index:1;}
.quote-mark{font-family:'Cormorant Garamond',serif;font-size:8rem;font-weight:300;color:rgba(200,146,42,.28);line-height:.8;margin-bottom:1rem;}
.quote-text{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(1.8rem,3.5vw,3rem);font-weight:300;line-height:1.7;color:var(--cream);max-width:840px;margin:0 auto 2.5rem;text-shadow:0 2px 30px rgba(0,0,0,.9);}
.quote-attr{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.4em;color:var(--amber);text-transform:uppercase;}

/* ════════════════════════════
   TESTIMONIALS — dark texture
════════════════════════════ */
.testimonials-section{position:relative;padding:10rem 5rem;}
.testimonials-bg{
  position:absolute;inset:0;
  background:url('./img/archives-bg02.jpg') center/cover no-repeat;
  filter:sepia(70%) brightness(.18) contrast(1.08) saturate(1.05);
}
.testimonials-overlay{position:absolute;inset:0;background:rgba(42,34,24,.9);}
.testimonials-inner{position:relative;z-index:1;}
.testimonials-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem;margin-top:5rem;}
.testimonial-card{padding:3rem;border:1px solid rgba(212,168,71,.15);position:relative;background:rgba(42,34,24,.65);backdrop-filter:blur(8px);}
.testimonial-card::before{content:'"';font-family:'Cormorant Garamond',serif;font-size:6rem;color:rgba(200,146,42,.1);position:absolute;top:-1rem;left:2rem;line-height:1;}
.testimonial-text{font-family:'Cormorant Garamond',serif;font-size:1.15rem;font-style:italic;line-height:1.9;color:var(--cream-dark);margin-bottom:2rem;}
.testimonial-author{display:flex;align-items:center;gap:1rem;}
.author-avatar{width:40px;height:40px;border:1px solid rgba(200,146,42,.35);background:rgba(200,146,42,.06);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;color:var(--amber);font-size:1.1rem;}
.author-info .name{font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.15em;color:var(--cream);display:block;}
.author-info .role{font-size:.75rem;color:var(--text-muted);}

/* ════════════════════════════
   CTA — dramatic finale
════════════════════════════ */
.cta-section{position:relative;padding:14rem 5rem;text-align:center;overflow:hidden;}
.cta-bg-img{
  position:absolute;inset:0;
  background:url('../img/archives-bg02.jpg') center/cover no-repeat;
  filter:sepia(59%) brightness(0.6) contrast(1.1) saturate(1.08);
  animation:kbZoom 24s ease-in-out infinite alternate;
}
.cta-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(212,168,71,.08) 0%,transparent 60%),linear-gradient(to bottom,rgba(42,34,24,.85) 0%,rgba(42,34,24,.65) 50%,rgba(42,34,24,.88) 100%);}
.cta-inner{position:relative;z-index:1;}
.cta-title{font-family:'Cormorant Garamond',serif;font-size:clamp(1.3rem,6vw,5.8rem);font-weight:300;line-height:1.2;margin-bottom:2rem;text-shadow:0 2px 50px rgba(0,0,0,.9);}
.cta-title em{font-style:italic;color:var(--amber-light);}
.cta-desc{font-size:.95rem;line-height:2;color:var(--silver);max-width:520px;margin:0 auto 3rem;}
.cta-actions{display:flex;justify-content:center;align-items:center;gap:2rem;}
.btn-outline{font-family:'Space Mono',monospace;font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--amber);background:transparent;border:1px solid var(--amber);padding:1.1rem 2.8rem;cursor:none;transition:all .3s;}
.btn-outline:hover{background:rgba(200,146,42,.12);}
.cta-note{margin-top:2rem;font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.2em;color:var(--text-muted);}

/* ─── RESPONSIVE ─── */
@media(max-width:1024px){
  nav{padding:1rem 1rem;}
  .hero{padding:0 0 5rem;}
  .about-grid,.process-grid,.testimonials-grid{grid-template-columns:1fr;}
  .services-grid{grid-template-columns:1fr;}
  .stats-bar{grid-template-columns:repeat(2,1fr);padding:2rem;}
  .about-section,.process-section{padding:6rem 2rem;}
  .services-section{padding:6rem 2rem;}
  .testimonials-section,.quote-banner{padding:6rem 2rem;}
  .cta-section{padding:8rem 2rem;}
  footer{grid-template-columns:1fr;padding:3rem 2rem;gap:2rem;}
  .footer-bottom{padding:1.5rem 2rem;flex-direction:column;gap:1rem;}
  .nav-links{display:none;}
  nav { padding:1.4rem 1.8rem; }
  .nav-hamburger { display:flex; }
  .nav-cta { display:none; }
  .nav-links { display:none; }
  #mobileMenu { display:flex; }
  .hero-actions {display: none;}
}

@media(max-width:768px){
  /* ── film-strip モバイル全画面表示 ── */
  .film-strip {
    display: flex;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    right: auto;
    top: 0;
    transform: none;
    flex-direction: column;
    z-index: 1;
    background: black;
    opacity: 0;
    animation: slideIn 1.5s ease 1s forwards;
  }
  .perf-rail { width: 18px; }
  /* film-reel：縦スクロール */
  .film-reel {
    display: flex;
    flex-direction: column;
    /*animation: filmScroll 64s linear infinite;*/
    will-change: transform;
    margin-right: 36px;
  }

  /* モバイルのperf-trackも同じ速度に合わせる */
  .perf-track { animation-duration: 64s; }
  /* 1枚が全画面幅・正方形に近い高さ */
  .film-frame {
    flex-shrink: 0;
    width: 100%;
    height: 100vw;
    margin: 3px 18px;
    border: 1px solid rgba(212,168,71,.28);
    filter: sepia(0%) brightness(.85) contrast(1.05) saturate(1.2);
  }
  /* hero-content はfilm-stripの上に重ねる */
  .hero-content {
    position: relative;
    z-index: 5;
    padding: 0 2rem;
  }
  .hero-video-bg {display: none;}
  #heroCanvas {display: none;}
  .hero-overlay {pointer-events: fill;}
}

@media(min-width:1025px){
  .hero-content {
    max-width: 1024px;
  }
}
@media(max-width:1024px){
  .hero-content {
    padding-left: 2rem;
  }
}

/* ════════ お知らせセクション（index.html） ════════ */
.news-section{
  padding:6rem 5rem 5rem;
  background:var(--sepia-dark);
  position:relative;
  border-bottom:1px solid rgba(212,168,71,.08);
}
.news-section-inner{
  max-width:1200px;margin:0 auto;
}
.news-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem;
}
.news-head-left .section-label{margin-bottom:.6rem}
.news-head-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.6rem,3.5vw,2.4rem);
  font-weight:300;line-height:1.2;color:var(--cream);
}
.news-head-title em{
  font-style:italic;color:var(--amber);font-weight:400;
}
.news-list{
  display:flex;flex-direction:column;gap:0;
  border-top:1px solid rgba(212,168,71,.12);
}
.news-item{
  display:grid;
  grid-template-columns:140px 110px 1fr;
  gap:1.4rem;align-items:baseline;
  padding:1.4rem 0;
  border-bottom:1px solid rgba(212,168,71,.12);
  text-decoration:none;color:inherit;
  transition:background .25s, padding .25s;
}
.news-item:hover{
  background:rgba(212,168,71,.04);
  padding-left:.8rem;padding-right:.8rem;
}
.news-date{
  font-family:'Space Mono',monospace;
  font-size:.72rem;letter-spacing:.08em;
  color:var(--text-muted);white-space:nowrap;
}
.news-sticker{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'Space Mono',monospace;
  font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;
  padding:5px 10px;border:1px solid;
  width:fit-content;white-space:nowrap;line-height:1;
}
.news-sticker.cat-event{
  color:#f5c563;border-color:rgba(245,197,99,.55);
  background:rgba(245,197,99,.07);
}
.news-sticker.cat-maintenance{
  color:#e8a3a3;border-color:rgba(232,163,163,.55);
  background:rgba(232,163,163,.07);
}
.news-sticker.cat-notice,
.news-sticker.cat-info{
  color:var(--silver);border-color:rgba(212,202,186,.4);
  background:rgba(212,202,186,.05);
}
.news-sticker.cat-update,
.news-sticker.cat-release{
  color:#9fc8a3;border-color:rgba(159,200,163,.5);
  background:rgba(159,200,163,.07);
}
.news-title-wrap{
  display:flex;align-items:baseline;gap:.7rem;
  font-family:'Noto Serif JP',serif;
  font-size:.95rem;line-height:1.6;color:var(--cream);
  font-weight:300;
  transition:color .2s;
}
.news-item:hover .news-title-wrap{color:var(--amber-light)}
.news-title{flex:1;min-width:0}
.news-arrow{
  flex-shrink:0;
  color:var(--amber);opacity:.6;
  font-family:'Space Mono',monospace;
  font-size:.7rem;letter-spacing:.1em;
  transition:transform .25s, opacity .25s;
}
.news-item:hover .news-arrow{transform:translateX(4px);opacity:1}
.news-empty{
  padding:2.4rem 0;text-align:center;
  color:var(--text-muted);
  font-size:.82rem;letter-spacing:.05em;
}
.news-foot{
  margin-top:1.6rem;text-align:right;
}
.news-foot a{
  font-family:'Space Mono',monospace;
  font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--amber);text-decoration:none;
  border-bottom:1px solid transparent;
  padding-bottom:2px;transition:border-color .2s;
}
.news-foot a:hover{border-bottom-color:var(--amber)}

@media(max-width:780px){
  .news-section{padding:4rem 1.5rem 3rem}
  .news-item{
    grid-template-columns:1fr;
    gap:.5rem;padding:1.2rem 0;
  }
  .news-item:hover{padding-left:0;padding-right:0}
  .news-date{font-size:.68rem}
  .news-title-wrap{font-size:.88rem}
  .news-head{margin-bottom:1.8rem}
}