/* ============================================================
   黒田司法書士事務所 - カスタムCSS
   ============================================================ */
.krd-page * { margin:0; padding:0; box-sizing:border-box; }
.krd-page { font-family:'游ゴシック','Yu Gothic','YuGothic','ヒラギノ角ゴ','Hiragino Sans',sans-serif; color:#2d2d2d; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
.krd-page a { text-decoration:none; }
::selection { background:rgba(201,169,110,0.25); }

/* HEADER */
.krd-header { position:fixed; top:0; left:0; right:0; z-index:200; height:56px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(16px,4vw,32px); transition:all 0.35s ease; background:transparent; }
.krd-header.scrolled { background:rgba(26,39,68,0.95); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.krd-header-logo { font-family:'Noto Serif JP',serif; font-size:clamp(12px,2.8vw,14px); color:#c9a96e; letter-spacing:2px; }
.krd-nav { display:flex; gap:20px; }
.krd-nav a { font-size:12px; color:#f8f6f1; letter-spacing:1px; opacity:0.8; transition:opacity 0.3s,color 0.3s; }
.krd-nav a:hover { opacity:1; color:#c9a96e; }
.krd-hamburger { display:none; flex-direction:column; background:none; border:none; cursor:pointer; padding:8px; }
.krd-hamburger span { width:22px; height:2px; background:#c9a96e; margin-bottom:5px; transition:all 0.3s; }
.krd-hamburger span:last-child { margin-bottom:0; }
.krd-mobile-menu { position:fixed; top:56px; left:0; right:0; bottom:0; background:rgba(26,39,68,0.97); backdrop-filter:blur(12px); z-index:190; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:32px; opacity:0; pointer-events:none; transition:opacity 0.3s; }
.krd-mobile-menu.open { opacity:1; pointer-events:auto; }
.krd-mobile-menu a { font-family:'Noto Serif JP',serif; font-size:18px; color:#f8f6f1; letter-spacing:4px; }
@media(max-width:839px) {
  .krd-nav { display:none !important; }
  .krd-hamburger { display:flex !important; }
}

/* SECTIONS */
.krd-section { padding:clamp(56px,10vw,96px) clamp(16px,4vw,24px); }
.krd-inner { max-width:960px; margin:0 auto; }
.krd-inner-sm { max-width:800px; margin:0 auto; }
.krd-inner-xs { max-width:600px; margin:0 auto; }
.krd-bg-offwhite { background:#f8f6f1; }
.krd-bg-white { background:#fff; }
.krd-bg-light-navy { background:#e8ebf0; }
.krd-bg-navy { background:#1a2744; }
.krd-bg-navy .krd-stitle h2 { color:#f8f6f1; }

/* SECTION TITLE */
.krd-stitle { text-align:center; margin-bottom:clamp(28px,5vw,48px); }
.krd-stitle h2 { font-family:'Noto Serif JP',serif; font-size:clamp(20px,4.5vw,28px); font-weight:600; color:#1a2744; letter-spacing:2px; margin:0 0 10px; }
.krd-stitle .sub { font-family:'Noto Serif JP',serif; font-size:11px; color:#c9a96e; letter-spacing:2px; margin:0 0 16px; }
.krd-stitle .line { width:50px; height:1px; background:linear-gradient(90deg,transparent,#c9a96e,transparent); margin:0 auto; }

/* HERO */
.krd-hero { position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; background:#1a2744; overflow:hidden; padding:0 clamp(20px,6vw,40px); }
.krd-hero-texture { position:absolute; inset:0; background-image:radial-gradient(ellipse at 30% 40%,rgba(201,169,110,0.05) 0%,transparent 55%),radial-gradient(ellipse at 70% 60%,rgba(201,169,110,0.03) 0%,transparent 50%),repeating-linear-gradient(0deg,transparent,transparent 80px,rgba(255,255,255,0.007) 80px,rgba(255,255,255,0.007) 81px),repeating-linear-gradient(90deg,transparent,transparent 80px,rgba(255,255,255,0.007) 80px,rgba(255,255,255,0.007) 81px); pointer-events:none; }
.krd-hero-content { position:relative; z-index:2; text-align:center; max-width:560px; }
.krd-hero-content .office { font-family:'Noto Serif JP',serif; font-size:clamp(11px,2.5vw,15px); color:#c9a96e; letter-spacing:clamp(4px,1vw,6px); margin-bottom:clamp(20px,4vw,36px); }
.krd-hero-content h1 { font-family:'Noto Serif JP',serif; font-size:clamp(24px,6vw,42px); font-weight:600; color:#f8f6f1; line-height:1.7; letter-spacing:clamp(2px,0.5vw,4px); margin:0 0 16px; }
.krd-hero-content .divider { width:36px; height:1px; background:#c9a96e; margin:clamp(16px,3vw,28px) auto; }
.krd-hero-content .sub { font-family:'Noto Serif JP',serif; font-size:clamp(12px,3vw,17px); color:#c9a96e; letter-spacing:clamp(1px,0.4vw,3px); margin:0 0 clamp(32px,6vw,52px); }
.krd-scroll-indicator { position:absolute; bottom:clamp(16px,3vw,32px); left:50%; transform:translateX(-50%); text-align:center; }
.krd-scroll-indicator .line { width:1px; height:32px; background:linear-gradient(180deg,#c9a96e,transparent); margin:0 auto 6px; }
.krd-scroll-indicator .text { font-size:9px; color:#c9a96e; letter-spacing:2px; }

/* HERO ANIMATION */
.krd-hero-content .office,.krd-hero-content h1,.krd-hero-content .divider,.krd-hero-content .sub,.krd-hero-content .btn-wrap,.krd-scroll-indicator { opacity:0; transform:translateY(16px); transition:opacity 0.9s ease,transform 0.9s ease; }
.krd-hero.loaded .office { opacity:1; transform:none; transition-delay:0.5s; }
.krd-hero.loaded h1 { opacity:1; transform:none; transition-delay:0.8s; }
.krd-hero.loaded .divider { opacity:1; transform:none; transition-delay:1.0s; }
.krd-hero.loaded .sub { opacity:1; transform:none; transition-delay:1.2s; }
.krd-hero.loaded .btn-wrap { opacity:1; transform:none; transition-delay:1.5s; }
.krd-hero.loaded .krd-scroll-indicator { opacity:0.45; transform:translateX(-50%) translateY(0); transition-delay:2.2s; }

/* BUTTONS */
.krd-btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 clamp(28px,5vw,44px); font-family:'Noto Serif JP',serif; font-size:clamp(13px,2.5vw,14px); letter-spacing:2px; border:none; cursor:pointer; transition:all 0.35s ease; }
.krd-btn-gold { background:#c9a96e; color:#1a2744; }
.krd-btn-gold:hover { background:#d4b97e; box-shadow:0 4px 20px rgba(201,169,110,0.3); transform:translateY(-1px); color:#1a2744; }
.krd-btn-outline { background:transparent; color:#c9a96e; border:1px solid #c9a96e; }
.krd-btn-outline:hover { background:#c9a96e; color:#1a2744; }

/* STRENGTHS */
.krd-strengths-grid { display:grid; grid-template-columns:1fr; gap:14px; }
.krd-strength-card { background:#fff; padding:clamp(24px,4vw,36px) clamp(16px,3vw,24px); text-align:center; border-bottom:2px solid transparent; transition:all 0.4s ease; }
.krd-strength-card:hover { box-shadow:0 8px 32px rgba(26,39,68,0.08); transform:translateY(-4px); border-bottom-color:#c9a96e; }
.krd-strength-card .icon { font-size:26px; margin-bottom:14px; }
.krd-strength-card .num { font-family:'Noto Serif JP',serif; font-size:11px; color:#c9a96e; letter-spacing:3px; margin-bottom:6px; }
.krd-strength-card h3 { font-family:'Noto Serif JP',serif; font-size:clamp(14px,2.8vw,16px); color:#1a2744; font-weight:600; margin-bottom:12px; letter-spacing:1px; line-height:1.6; }
.krd-strength-card p { font-size:clamp(12px,2.4vw,13px); color:#2d2d2d; line-height:1.9; }
@media(min-width:600px) { .krd-strengths-grid { grid-template-columns:1fr 1fr; } }
@media(min-width:840px) { .krd-strengths-grid { grid-template-columns:repeat(4,1fr); } }

/* SERVICE CARDS */
.krd-svc-grid { display:grid; grid-template-columns:1fr; gap:16px; }
.krd-svc-card { border:1px solid #ddd; padding:clamp(28px,5vw,40px) clamp(20px,4vw,32px); background:#fff; transition:border-color 0.3s; cursor:pointer; }
.krd-svc-card:hover { border-color:#c9a96e; }
.krd-svc-card h3 { font-family:'Noto Serif JP',serif; font-size:clamp(16px,3vw,18px); color:#1a2744; font-weight:600; margin-bottom:14px; letter-spacing:1px; }
.krd-svc-card p { font-size:clamp(13px,2.5vw,14px); color:#2d2d2d; line-height:1.9; margin-bottom:20px; }
.krd-svc-card .cta { font-family:'Noto Serif JP',serif; font-size:13px; color:#c9a96e; letter-spacing:1px; }
@media(min-width:600px) { .krd-svc-grid { grid-template-columns:1fr 1fr; } }

/* REPRESENTATIVE */
.krd-rep-layout { display:flex; flex-direction:column; gap:32px; align-items:center; }
.krd-rep-photo { width:100%; max-width:280px; aspect-ratio:3/4; background:linear-gradient(135deg,#1a2744,#243356); display:flex; align-items:center; justify-content:center; }
.krd-rep-photo .placeholder { text-align:center; }
.krd-rep-photo .placeholder .icon { font-size:40px; margin-bottom:8px; opacity:0.4; }
.krd-rep-photo .placeholder p { font-size:11px; color:#c9a96e; opacity:0.6; }
.krd-rep-text .bio { font-size:clamp(13px,2.6vw,15px); color:#2d2d2d; line-height:2.0; margin-bottom:28px; }
.krd-seminar-label { font-family:'Noto Serif JP',serif; font-size:12px; color:#c9a96e; letter-spacing:2px; margin-bottom:14px; text-align:center; }
.krd-seminar-grid { display:grid; grid-template-columns:1fr; gap:10px; margin-bottom:28px; }
.krd-seminar-card { background:#1a2744; padding:clamp(14px,3vw,20px) clamp(12px,2vw,16px); text-align:center; }
.krd-seminar-card .top { font-size:clamp(10px,2vw,11px); color:#c9a96e; margin-bottom:6px; letter-spacing:1px; }
.krd-seminar-card .bottom { font-family:'Noto Serif JP',serif; font-size:clamp(12px,2.4vw,14px); color:#f8f6f1; font-weight:600; letter-spacing:1px; line-height:1.5; }
@media(min-width:600px) { .krd-seminar-grid { grid-template-columns:1fr 1fr; } }
@media(min-width:840px) { .krd-rep-layout { flex-direction:row; align-items:flex-start; gap:44px; } }

/* FLOW */
.krd-flow-list { max-width:400px; margin:0 auto; }
.krd-flow-step { display:flex; align-items:flex-start; gap:clamp(14px,3vw,24px); padding:clamp(14px,2.5vw,20px) 0; }
.krd-flow-num { width:44px; height:44px; border-radius:50%; border:1.5px solid #c9a96e; display:flex; align-items:center; justify-content:center; font-family:'Noto Serif JP',serif; font-size:14px; color:#c9a96e; flex-shrink:0; }
.krd-flow-step h4 { font-family:'Noto Serif JP',serif; font-size:clamp(14px,2.8vw,16px); color:#1a2744; font-weight:600; margin-bottom:4px; }
.krd-flow-step p { font-size:clamp(12px,2.4vw,13px); color:#2d2d2d; line-height:1.7; }
.krd-flow-line { width:1px; height:20px; background:rgba(201,169,110,0.4); margin-left:22px; }

/* COLUMN */
.krd-column-grid { display:grid; grid-template-columns:1fr; gap:16px; }
.krd-column-card { background:#fff; padding:clamp(16px,3vw,24px); border-left:3px solid #c9a96e; transition:box-shadow 0.3s; cursor:pointer; }
.krd-column-card:hover { box-shadow:0 4px 16px rgba(26,39,68,0.08); }
.krd-column-card .meta { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.krd-column-card .cat { font-size:10px; color:#c9a96e; letter-spacing:1px; border:1px solid rgba(201,169,110,0.6); padding:2px 10px; font-family:'Noto Serif JP',serif; }
.krd-column-card .date { font-size:11px; color:#aaa; }
.krd-column-card h4 { font-family:'Noto Serif JP',serif; font-size:clamp(13px,2.6vw,14px); color:#1a2744; line-height:1.8; font-weight:500; }
@media(min-width:600px) { .krd-column-grid { grid-template-columns:1fr 1fr 1fr; } }

/* AREA */
.krd-area-layout { display:flex; flex-direction:column; gap:28px; align-items:center; }
.krd-area-map { width:100%; max-width:300px; aspect-ratio:4/3; background:linear-gradient(135deg,#f8f6f1,#eee); border:1px solid #ddd; display:flex; align-items:center; justify-content:center; }
.krd-area-map .icon { font-size:36px; opacity:0.35; margin-bottom:6px; text-align:center; }
.krd-area-map p { font-size:11px; color:#999; text-align:center; }
.krd-area-text p { font-size:clamp(13px,2.6vw,15px); color:#2d2d2d; line-height:2.0; margin-bottom:20px; }
.krd-area-tags { display:flex; gap:10px; flex-wrap:wrap; }
.krd-area-tag { padding:8px 18px; font-family:'Noto Serif JP',serif; font-size:clamp(12px,2.4vw,13px); letter-spacing:1px; border:1px solid #1a2744; }
.krd-area-tag.active { background:#1a2744; color:#f8f6f1; }
@media(min-width:840px) { .krd-area-layout { flex-direction:row; gap:44px; } }

/* CTA */
.krd-cta-tel { font-family:'Noto Serif JP',serif; font-size:clamp(26px,7vw,38px); color:#f8f6f1; letter-spacing:3px; font-weight:600; margin-bottom:10px; display:block; text-align:center; }
.krd-cta-note { font-size:clamp(11px,2.2vw,13px); color:#c9a96e; margin-bottom:clamp(28px,5vw,40px); letter-spacing:1px; line-height:1.7; text-align:center; }
.krd-cta-message { font-family:'Noto Serif JP',serif; font-size:clamp(12px,2.4vw,14px); color:#c9a96e; margin-top:clamp(28px,5vw,40px); font-style:italic; line-height:1.9; letter-spacing:1px; opacity:0.75; text-align:center; }

/* FOOTER */
.krd-footer { background:#111820; padding:clamp(36px,6vw,48px) clamp(16px,4vw,24px) clamp(24px,4vw,32px); text-align:center; border-top:1px solid rgba(201,169,110,0.12); }
.krd-footer .logo { font-family:'Noto Serif JP',serif; font-size:clamp(12px,2.6vw,14px); color:#c9a96e; letter-spacing:3px; margin-bottom:14px; }
.krd-footer .info { font-size:clamp(11px,2.2vw,12px); color:#666; line-height:1.8; margin-bottom:20px; }
.krd-footer .foot-line { width:28px; height:1px; background:#c9a96e; margin:0 auto 16px; opacity:0.3; }
.krd-footer .copy { font-size:10px; color:#555; letter-spacing:1px; }

/* FADE ANIMATION */
.krd-fade { opacity:0; transform:translateY(24px); transition:opacity 0.7s ease,transform 0.7s ease; }
.krd-fade.visible { opacity:1; transform:translateY(0); }
.krd-fade.d1 { transition-delay:0.1s; }
.krd-fade.d2 { transition-delay:0.2s; }
.krd-fade.d3 { transition-delay:0.3s; }