/* =====================================================
   SUICH | profile.css
   ─────────────────────────────────────────────────
   【用途】代表メッセージページ（profile.html）専用のスタイル
   　・プロフィール写真・名前・役職の表示
   　・取り組みアプローチカード（4つのポイント）
   　・実績テーブル
   　・代表メッセージレター
===================================================== */
/* =====================================================
   SUICH | profile.css
   ページ固有スタイル
===================================================== */

/* ━━━ HEADER & MEGA MENU ━━━ */
}

  /* HERO */
  
  
  
  
  
   
  
  
  
  to{opacity:1;transform:translateY(0)}}
  

  /* PROFILE INTRO */
  .profile-intro{display:grid;grid-template-columns:300px 1fr;gap:0;align-items:stretch;animation:fadeUp 0.7s ease 0.15s both;}
  .profile-photo-col{background:var(--green-mid);padding:72px 56px;display:flex;flex-direction:column;align-items:center;text-align:center;}
  .profile-avatar{width:120px;height:120px;background:var(--green-dark);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:48px;margin:0 auto 20px;border:2px solid rgba(74,145,98,0.4);}
  .profile-name{font-family:'Noto Serif JP',serif;font-size:22px;font-weight:700;color:#fff;margin-bottom:4px;}
  .profile-name-en{font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--on-dark-high);letter-spacing:0.15em;margin-bottom:20px;}
  .profile-role{font-size:16px;letter-spacing:0.15em;color:var(--on-dark-low);background:var(--on-dark-ghost);padding:8px 16px;border-radius:2px;margin-bottom:28px;}
  .profile-divider{width:32px;height:1px;background:var(--on-dark-faint);margin:0 auto 24px;}
  .profile-tags{display:flex;flex-direction:column;gap:8px;width:100%;}
  .profile-tag{font-size:16px;color:var(--on-dark-low);background:var(--on-dark-ghost);border:1px solid var(--on-dark-ghost);padding:8px 14px;border-radius:2px;text-align:left;line-height:1.5;}
  .profile-tag strong{display:block;color:var(--green-muted);font-size:16px;letter-spacing:0.15em;margin-bottom:2px;}

  .profile-message-col{background:#fff;padding:56px 52px;display:flex;flex-direction:column;justify-content:center;}
  .profile-message-col .sub-label{font-size:16px;letter-spacing:0.25em;color:var(--green-accent);font-weight:500;margin-bottom:12px;text-transform:uppercase;}
  .profile-message-col h1{font-family:'Noto Serif JP',serif;font-size:clamp(20px,2.5vw,32px);font-weight:700;color:var(--green-dark);line-height:1.55;margin-bottom:22px;}
  .profile-message-col h1 em{font-style:normal;color:var(--green-accent);}
  .profile-message-col p{font-size:16px;color:var(--grey-mid);line-height:1.95;margin-bottom:14px;}
  .profile-message-col p:last-child{margin-bottom:0;}

  /* CONTENT */
  .content-section{max-width:1440px;margin:0 auto;padding:144px 96px;}
  .section-num{font-family:'Cormorant Garamond',serif;font-size:16px;letter-spacing:0.25em;color:var(--green-accent);font-weight:600;margin-bottom:8px;text-transform:uppercase;}
  .section-title{font-family:'Noto Serif JP',serif;font-size:clamp(18px,2.2vw,26px);font-weight:700;color:var(--green-dark);line-height:1.5;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border);}
  .lead-text{font-size:16px;color:var(--grey-mid);line-height:1.95;margin-bottom:36px;}

  /* APPROACH CARDS */
  .approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:56px;}
  .approach-card{border:1px solid var(--border);border-radius:4px;overflow:hidden;transition:box-shadow 0.2s,transform 0.2s;}
  .approach-card-body{padding: 32px;}
  .approach-card:hover{box-shadow:0 6px 32px rgba(45,90,61,0.1);transform:translateY(-2px);}
  .approach-card-head{background:var(--green-dark);padding:18px 24px;display:flex;align-items:center;gap:14px;}
  .approach-big-num{margin-top: -0.3em; font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;color: var(--green-vivid);line-height:1;flex-shrink:0;}
  .approach-card-head h3{font-family:'Noto Serif JP',serif;font-size:16px;font-weight:700;color:#fff;line-height:1.5;}
  .approach-card-
  .approach-card-body p{font-size:16px;color:var(--grey-mid);line-height:1.9;}
  .approach-highlight{display:inline-block;background:var(--green-pale);border:1px solid var(--green-muted);border-radius:2px;padding:2px 8px;font-size:16px;color:var(--green-mid);font-weight:600;margin-top:10px;}

  /* ACHIEVEMENT TABLE */
  .achievement-wrap{margin-bottom:56px;}
  .ach-table{width:100%;border-collapse:collapse;font-size:16px;}
  .ach-table thead th{background:var(--green-dark);color:#fff;padding:14px 20px;text-align:left;font-weight:500;font-size:16px;letter-spacing:0.08em;}
  .ach-table td{padding:18px 20px;border-bottom:1px solid var(--border);vertical-align:top;line-height:1.75;}
  .ach-table td:first-child{color:var(--grey-mid);font-size:16px;}
  .ach-table td:nth-child(2){color:var(--grey-mid);font-size:16px;}
  .ach-table td:nth-child(3){color:var(--green-mid);font-weight:600;font-size:16px;}
  .ach-table tr:nth-child(even) td{background:var(--grey-pale);}
  .ach-table tr:last-child td{border-bottom:none;}

  /* MESSAGE LETTER */
  .message-letter{background:var(--green-dark);border-radius:4px;padding:52px 56px;margin-bottom:56px;position:relative;overflow:hidden;}
  .message-letter::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 80% 20%,rgba(74,145,98,0.2) 0%,transparent 60%);}
  .message-letter-inner{position:relative;}
  .letter-label{font-size:20px;letter-spacing:0.25em;color:var(--on-dark-high);font-weight:500;margin-bottom:20px;text-transform:uppercase;}
  .letter-body p{font-family:'Noto Serif JP',serif;font-size:16px;color:var(--on-dark-mid);line-height:2;margin-bottom:18px;}
  .letter-body p:last-of-type{margin-bottom:28px;}
  .letter-sig{font-family:'Noto Serif JP',serif;font-size:16px;color:var(--on-dark-low);text-align:right;padding-top:20px;border-top:1px solid var(--on-dark-ghost);}
  .letter-sig strong{display:block;font-size:17px;color:#fff;margin-top:6px;}

  /* CTA */
  .cta-block{background:var(--green-mid);border-radius:4px;padding:44px 40px;text-align:center;position:relative;overflow:hidden;}
  .cta-block::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 80% at 70% 30%,rgba(74,145,98,0.3) 0%,transparent 65%);}
  .cta-inner{position:relative;}
  .cta-block h3{font-family:'Noto Serif JP',serif;font-size:22px;font-weight:700;color:#fff;line-height:1.55;margin-bottom:10px;}
  .cta-block p{font-size:16px;color:var(--on-dark-low);margin-bottom:28px;line-height:1.95;}
  
  
  
  
  
  
  

  /* RELATED */
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  

  

  /* ── MAIN SITE BANNER ── */
  
  
  
  
  
  
  
  

/* ━━━ PLACEHOLDER IMAGES ━━━ */

/* ─── PROFILE INTRO WRAP ─── */
.profile-intro-wrap { max-width:1440px; margin:32px auto 0; padding:0 96px; }
.profile-avatar--photo { font-size:0; border:none; width:160px; height:160px; border-radius:50%; overflow: hidden; }
.profile-avatar--photo img{width: 100%; height: 100%; object-fit: cover;}
.ach-col-narrow  { width:32%; }
.ach-col-mid     { width:38%; }
.ach-col-wide    { width:30%; }
.section-block--mb { margin-bottom:72px; }

/* section headings (synced from guide.css) */
.section-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  letter-spacing: 0.25em;
  color: var(--green-accent);
  font-weight: 600;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.section-num em {
  font-style: normal;
  font-size: 50px;
  font-weight: 500;
}

.section-title {
  font-family: 'Noto Serif JP', serif;
  font-size: clamp(24px, 3.7vw, 36px);
  font-weight: 700;
  color: var(--green-dark);
  line-height: 1.5;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}

/* Mobile layout */
@media (max-width: 900px) {
  .profile-intro-wrap,
  .content-section {
    padding-left: 5vw;
    padding-right: 5vw;
  }
  .profile-intro,
  .approach-grid {
    grid-template-columns: 1fr;
  }
  .profile-photo-col,
  .profile-message-col,
  .message-letter,
  .cta-block {
    padding: 6vw 5vw;
  }
  .profile-tags {
    max-width: 360px;
    margin: 0 auto;
  }
  .ach-wrap {
    overflow-x: auto;
    margin-left: -5vw;
    margin-right: -5vw;
    padding: 0 5vw;
  }
  .ach-table {
    min-width: 680px;
  }
  
  .achievement-wrap{
  overflow-x: auto;
    margin-left: -5vw;
    margin-right: -5vw;
    padding: 0 5vw;
  }
}

@media (max-width: 480px) {
  .profile-intro-wrap,
  .content-section {
    padding-left: 4vw;
    padding-right: 4vw;
  }
}