body { padding-top: 80px; color: #00152d; font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; line-height: 1.9; background: #fff; }
html { scroll-padding-top: 100px; }
footer { background: #fcfcfc; border-top: 1px solid #eee; color: #666f80; font-size: 0.85rem; }
footer p.fw-bold { color: #00152d !important; letter-spacing: 0.05em; }
.section-block { margin-top: 2.25rem; }
.section-block + .section-block { padding-top: 2rem; margin-top: 2rem; }
.next-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }

a { color: #00152d; text-decoration: none; border-bottom: 1px solid #eee; transition: 0.2s ease; padding-bottom: 1px; }
a:hover { color: #4338ca; border-bottom-color: #4338ca; }
a.btn { border: 1px solid #00152d !important; color: #00152d !important; border-radius: 0; font-weight: 700; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.05em; transition: all 0.2s ease; background-color: transparent !important; }
a.btn:hover { background-color: #00152d !important; color: #fff !important; }
a.btn-outline-primary { border-color: #4338ca !important; color: #4338ca !important; }
a.btn-outline-primary:hover { background-color: #4338ca !important; color: #fff !important; }
a.btn-outline-orange { border-color: #d35400 !important; color: #d35400 !important; }
a.btn-outline-orange:hover { background-color: #d35400!important; color: #fff !important; }

.navbar { background: rgba(255, 255, 255, 0.95) !important; backdrop-filter: blur(10px); border-bottom: 1px solid #eee; box-shadow: none; }
.navbar-brand { color: #00152d !important; font-weight: 800; letter-spacing: -0.02em; }
.navbar-nav .nav-link { color: #666f80 !important; font-weight: 600; font-size: 0.9rem; }
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active { color: #00152d !important; }
.navbar a { border-bottom: none !important; }
.navbar-toggler { border-radius: 0 !important; border: 1px solid #ccc !important; padding: 0.4rem 0.6rem; transition: border-color 0.2s ease;}
.navbar-toggler:focus { box-shadow: none !important; border-color: #00152d !important;}
@media (max-width: 991.98px) {
  .navbar-collapse {  background: rgba(255, 255, 255, 0.98);  padding: 1rem 1.25rem;  border: 1px solid #eee;  border-top: 2px solid #00152d;   margin-top: 0.5rem;  }
  .navbar-nav {align-items: flex-end; text-align: right; }
  .navbar-nav .nav-link {  padding-right: 0 !important;  display: inline-block;font-weight: 800;}
  .navbar-nav.flex-row { justify-content: flex-end; margin-top: 0.5rem; }
}

.hero-img-container { margin-top: 2rem; margin-bottom: 3.5rem; } 
.hero-title { font-weight: 900; font-size: clamp(1.7rem, 2.6vw, 2.2rem); line-height: 1.12; letter-spacing: -0.02em; margin: 0 0 .5rem 0; color: #00152d; }
.hero-kicker { font-weight: 600; font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height: 1.5; color: #666f80; margin: 0 0 2.2rem 0; }

.h2.section-title { font-weight: 900; color: #00152d; font-size: 1.15rem; letter-spacing: -0.01em; margin-bottom: .75rem; }

.tag { display: inline-block; font-size: 0.7rem; font-weight: 700; padding: 0.3em 0.6em; border-radius: 0; background: #212529; color: #fff; margin-bottom: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tag-blue { background: #4338ca; }
.tag-episode, .episode-label { display: inline-block; font-size: 0.7rem; font-weight: 700; padding: 0.3em 0.6em; border-radius: 0; background: #d35400; color: #fff; margin-bottom: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tag-gray { background: #6c757d; }


.fold-example { background: #fdfdfd; border-radius: 0; padding: 1rem 1.25rem; transition: border-color 0.2s ease, background-color 0.2s ease; border: 1px solid #eee; margin-bottom: 1rem; }
.fold-example:hover { border-color: #212529; background-color: #fff; }
.fold-example summary {position: relative; padding-left: 25px !important; display: block; }
.fold-example summary::-webkit-details-marker { display: none; }
.fold-example summary::before { content: ''; position: absolute; left: 5px; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; border: 1.5px solid #6c757d; background-color: transparent; display: block !important; transition: all 0.2s ease; }
.fold-example:hover summary { color: #4338ca; }
.fold-example:hover summary::before { border-color: #4338ca; }
.fold-example[open] summary::before { border-color: #4338ca; background-color: #4338ca; }

.card-strong { background: #fff; border: 1px solid #e9ecef; border-radius: 0; padding: 1.1rem 1.15rem; }
.card-strong a { border-bottom-color: #ccc; }

.statement {padding: 1.2rem 1.5rem; background: #fdfdfd; border-radius: 0; border: 1px solid #eee;}
.statement p { margin: 0; }
.statement p + p { margin-top: .75rem; }

@media (max-width: 767.98px) {
  .fold-example {padding: 1rem 0.5rem; }
  .fold-example .ps-1 {padding-left: 0.25rem !important;}
  .card-strong {padding: 1.25rem 0.5rem;}
  .statement {padding: 1rem 0.5rem; }
}

#btn-back-to-top {   position: fixed;   bottom: 30px;   right: 30px;   display: none;  z-index: 1000;  width: 45px;  height: 45px;  border-radius: 0;  text-align: center;  transition: 0.2s;  border: 1px solid #00152d;  background-color: #fff;  color: #00152d;  font-size: 1.2rem;  font-weight: bold;  line-height: 43px;  padding: 0;  cursor: pointer;}
@media (hover: hover) {
  #btn-back-to-top:hover { background-color: #00152d; color: #fff; transform: translateY(-3px); }
}
@media (max-width: 768px) {
  #btn-back-to-top { bottom: 20px; right: 15px; width: 40px; height: 40px; line-height: 38px; }
}
