/* =========================================================
  top.css
  - トップ専用（Hero / Menu / Solutions / System / IG / Access / Team）
========================================================= */

/* =========================================================
  Typography（トップ見出しの整え）
========================================================= */
.page .hero-title,
.page .section-head .jp{
  font-family:"Noto Serif JP", serif;
}

.hero-title{
  max-width:16.2em;
  font-size:clamp(26px, 3.8vw, 36px);
  line-height:1.4;
  letter-spacing:.02em;
  text-wrap:balance;
}

.hero-title ._gold{ color:rgba(184,138,26,.92); }

.hero-en{
  color:rgba(184,138,26,.92);
  letter-spacing:.22em;
}

.hero-lead{
  max-width:78ch;
  margin-top:14px;
  padding:14px 14px 14px 16px;
  line-height:1.95;

  border-left:3px solid rgba(184,138,26,.30);
  border-radius:14px;
  background:rgba(255,255,255,.62);
  box-shadow:0 12px 26px rgba(0,0,0,.05);
}


/* =========================================================
  Buttons / CTA（トップの色味）
========================================================= */
.header-cta{
  background:rgba(255,255,255,.94);
  border-color:rgba(47,127,111,.26);
  box-shadow:0 12px 26px rgba(0,0,0,.06);
}
.header-cta .dot{ background:var(--accent); }

.header-cta--sub{
  padding:10px 12px;
  border-radius:999px;
  font-weight:600;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(0,0,0,.10);
  box-shadow:0 10px 22px rgba(0,0,0,.05);
  color:rgba(17,17,17,.82);
}
.header-cta--sub:hover{
  border-color:rgba(47,127,111,.22);
  background:rgba(47,127,111,.06);
}
.drawer-cta--sub{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.10);
  color:rgba(17,17,17,.86);
}

.btn--primary{
  background:linear-gradient(180deg, rgba(67,160,142,.96), rgba(47,127,111,.96));
  border-color:rgba(0,0,0,.10);
  box-shadow:0 14px 30px rgba(0,0,0,.08);
}
.btn--primary:hover{
  filter:saturate(1.04) brightness(1.02);
  transform:translateY(-1px);
}
.btn--ghost{
  border-color:rgba(47,127,111,.18);
  background:rgba(255,255,255,.78);
}
.btn--ghost:hover{
  background:rgba(47,127,111,.06);
  border-color:rgba(47,127,111,.26);
}
.btn.is-small{
  padding:12px 14px;
  font-size:13px;
}

/* 「相談する」ボタンを消す場合（HTML削除が理想。CSSで消すならこれ） */
.hero-ctaWrap .btn--ghost{ display:none; }

/* section head accents */
.section-head .en .cap{
  border:1px solid rgba(47,127,111,.18);
  background:rgba(47,127,111,.06);
}
.section-head .en::before,
.section-head .en::after{
  background:rgba(47,127,111,.28);
}

/* =========================================================
  Hero Layout
========================================================= */
.hero{
  padding: 58px 0 44px;
  position: relative;
}
.hero--paper{
  background:
    radial-gradient(980px 520px at 62% 34%, rgba(111,143,122,.18), transparent 60%),
    radial-gradient(720px 420px at 18% 26%, rgba(111,143,122,.12), transparent 62%),
    transparent;
}
.hero--paper::after{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  background-image: var(--noise);
  opacity:.55;
  mix-blend-mode:multiply;
}
.hero-inner{ position: relative; z-index: 1; }

.hero-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  grid-template-areas:
    "head visual"
    "body visual";
  gap:32px;
  align-items:start;
}
.hero-head{ grid-area:head; }
.hero-body{ grid-area:body; }
.hero-visual{ grid-area:visual; }

.hero-tag{
  margin: 0 0 14px;
  display:inline-flex;
  align-items:center;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(111,143,122,.90);
  color: #fff;
  font-size: 13px;
  letter-spacing:.06em;
  box-shadow: 0 12px 24px rgba(0,0,0,.12);
}

.hero-badgeRow{
  margin-top:14px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.hero-chip{
  display:inline-flex;
  align-items:center;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(47,127,111,.18);
  background:rgba(255,255,255,.82);
  box-shadow:0 10px 22px rgba(0,0,0,.05);
  font-size:12px;
  color:rgba(17,17,17,.70);
  letter-spacing:.04em;
}

.hero-ctaWrap{
  margin-top: 18px;
  display:flex;
  gap: 12px;
  flex-wrap:wrap;
}

.hero-visual.hero-visual--blend{
  position:relative;
  width:100%;
  max-width:480px;
  aspect-ratio:1 / 1.25;

  margin:10px 0 0 auto;
  border-radius:24px 24px 24px 0;
  overflow:hidden;

  background:rgba(255,255,255,.4);
}
.hero-visual.hero-visual--blend::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:
    linear-gradient(180deg, var(--hero-overlay), rgba(251,253,252,0) 55%),
    radial-gradient(520px 380px at 20% 20%, rgba(244,183,64,.10), transparent 62%),
    radial-gradient(520px 380px at 80% 40%, rgba(67,160,142,.10), transparent 62%),
    var(--hero-overlay-dark);
}
.hero-visual.hero-visual--blend .hero-bgImg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.78;
  filter:saturate(1.05) contrast(1.02) brightness(1.02);
  mix-blend-mode:multiply;
  pointer-events:none;
  z-index:0;
}

/* PC：右画像に合わせて左を収める */
@media (min-width:901px){
  .hero-grid{ gap:24px; }
  .hero-head{ padding-top:2px; }
  .hero-en{ margin-top:8px; }

  .hero-lead{
    margin-top:10px;
    padding:12px 12px 12px 14px;
    line-height:1.82;

    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:5; /* 4〜6で微調整 */
    overflow:hidden;
  }
  .hero-lead::before{ margin:2px 0 8px; }

  .hero-badgeRow{
    margin-top:10px;
    max-height:78px;
    overflow:hidden;
  }
  .hero-ctaWrap{ margin-top:12px; }
}

/* SP */
@media (max-width: 900px){
  .hero-grid{
    grid-template-columns: 1fr;
    grid-template-areas:
      "head"
      "visual"
      "body";
    gap: 18px;
  }
  .hero-visual.hero-visual--blend{
    max-width: 520px;
    margin: 4px auto 0;
  }
}
.hero-kicker{
  margin: 0 0 10px;
  display:inline-flex;
  align-items:center;
  gap: 8px;

  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: rgba(47,127,111,.92);

  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(47,127,111,.18);
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 22px rgba(0,0,0,.05);
}

/* PCは不要なら非表示（または薄く） */
@media (min-width: 921px){
  .hero-kicker{ display:none; } /* PCはヘッダー側に置く運用なら */
}

/* =========================================================
  Shared Panel Base（トップ内のパネル共通）
========================================================= */
.trust-panel,
.menu-panel,
.solutions-panel,
.system-panel,
.ig-panel,
.team-min,
.access-panel{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  border:1px solid var(--line);
  box-shadow:var(--shadow-soft);
}

.trust-panel::after,
.menu-panel::after,
.solutions-panel::after,
.system-panel::after,
.ig-panel::after,
.team-min::after,
.access-panel::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:var(--noise);
  mix-blend-mode:multiply;
}

.trust-panel > *,
.menu-panel > *,
.solutions-panel > *,
.system-panel > *,
.ig-panel > *,
.team-min > *,
.access-panel > *{
  position:relative;
  z-index:1;
}

/* =========================================================
  Trust Panel
========================================================= */
.trust-panel{
  margin-top:16px;
  padding:16px 18px 14px;
  background:
    radial-gradient(720px 320px at 14% 22%, rgba(244,183,64,.14), transparent 62%),
    rgba(255,255,255,.90);
}
.trust-panel::after{ opacity:.14; }

.trust-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.trust-kicker{
  margin:0;
  font-size:11.5px;
  letter-spacing:.18em;
  color:rgba(47,127,111,.95);
  text-transform:uppercase;
}

.trust-title{
  margin:6px 0 0;
  max-width:78ch;
  font-family:"Noto Serif JP", serif;
  font-size:16px;
  font-weight:700;
  line-height:1.6;
  color:rgba(17,17,17,.90);
}

.trust-note{
  margin:8px 0 0;
  max-width:90ch;
  font-size:13.5px;
  line-height:1.9;
  color:rgba(17,17,17,.70);
}

.trust-badges{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.trust-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:999px;

  border:1px solid rgba(47,127,111,.18);
  background:rgba(255,255,255,.80);
  box-shadow:0 10px 22px rgba(0,0,0,.04);

  font-size:12px;
  color:rgba(17,17,17,.70);
  white-space:nowrap;
}

.trust-badge i{
  width:10px;
  height:10px;
  border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 5px rgba(244,183,64,.12);
}

/* trust panel with photo */
.trust-panel--withPhoto .trust-split{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:14px;
  align-items:stretch;
}
.trust-panel--withPhoto .trust-main{ min-width:0; }

.trust-panel--withPhoto .trust-photo{
  margin:0;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.08);
  background:rgba(255,255,255,.92);
  box-shadow:0 12px 26px rgba(0,0,0,.05);
}
.trust-panel--withPhoto .trust-photo img{
  width:100%;
  height:100%;
  min-height:220px;
  object-fit:cover;
  display:block;
}

@media (max-width: 900px){
  .trust-panel--withPhoto .trust-split{
    grid-template-columns: 1fr;
  }
}

/* =========================================================
  Menu Panel（#menu）
========================================================= */
.menu-panel{
  margin-top: 18px;
  padding: 18px;
  background:
    radial-gradient(720px 320px at 18% 22%, rgba(67,160,142,.14), transparent 62%),
    rgba(255,255,255,.90);
}
.menu-panel::after{ opacity:.12; }

/* “目的別カード” */
.menu-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 14px;
}
@media (min-width: 820px){
  .menu-grid.is-9{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.menu-card{
  border-radius: 20px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
  padding: 14px 14px 12px;
  display:block;
  color: inherit;
}
.menu-card:hover{
  transform: translateY(-1px);
  border-color: rgba(47,127,111,.22);
}
.menu-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.menu-icon img{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display:block;
  border: 1px solid rgba(0,0,0,.08);
}
.badge-tag{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing:.04em;
  border: 1px solid rgba(47,127,111,.18);
  background: rgba(47,127,111,.06);
  color: rgba(17,17,17,.78);
  white-space: nowrap;
}
.badge-tag.is-tax{ border-color: rgba(244,183,64,.22); background: rgba(244,183,64,.10); }
.badge-tag.is-labor{ border-color: rgba(67,160,142,.20); background: rgba(67,160,142,.08); }
.badge-tag.is-dx{ border-color: rgba(47,127,111,.20); background: rgba(47,127,111,.08); }
.badge-tag.is-brand{ border-color: rgba(184,138,26,.22); background: rgba(184,138,26,.10); }
.badge-tag.is-realestate{ border-color: rgba(0,0,0,.12); background: rgba(0,0,0,.04); }

.menu-h{
  margin:0 0 6px;
  font-weight: 700;
  line-height: 1.6;
  color: rgba(17,17,17,.90);
}
.menu-d{
  margin:0;
  font-size: 13px;
  line-height: 1.9;
  color: rgba(17,17,17,.68);
}
.menu-tags{
  margin:10px 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap: 6px;
}
.menu-tags li{
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  color: rgba(17,17,17,.64);
}
.menu-disclaimer{
  margin: 14px 0 0;
  font-size: 12.5px;
  color: rgba(17,17,17,.64);
  line-height: 1.9;
}

/* =========================================================
  Solutions sets（6セット）
========================================================= */
.solutions-panel{
  margin-top: 16px;
  padding: 18px;
  background:
    radial-gradient(820px 360px at 12% 20%, rgba(244,183,64,.10), transparent 62%),
    rgba(255,255,255,.90);
}
.solutions-panel::after{ opacity:.12; }

.solutions-sets{
  display:grid;
  gap: 18px;
}
.solutions-set{
  border-radius: 26px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
  padding: 16px;
}

.solutions-head .solutions-kicker{
  margin:0;
  font-size: 11.5px;
  letter-spacing: .18em;
  color: rgba(47,127,111,.92);
}
.solutions-title{
  margin: 6px 0 8px;
  font-family:"Noto Serif JP", serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.65;
  color: rgba(17,17,17,.90);
}
.solutions-lead{
  margin:0;
  font-size: 13.5px;
  line-height: 1.95;
  color: rgba(17,17,17,.70);
}

.photo-band{ margin-top: 12px; }
.pb-item{
  margin:0;
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
}
.pb-item img{
  width:100%;
  height: 220px;
  object-fit: cover;
  display:block;
}
@media (min-width: 920px){
  .pb-item img{ height: 260px; }
}

.solutions-grid{
  margin-top: 12px;
  display:grid;
  grid-template-columns: 1fr;
}
.solution-card{
  display:block;
  border-radius: 22px;
  border: 1px solid rgba(47,127,111,.18);
  background: rgba(47,127,111,.06);
  padding: 14px 14px 12px;
  color: inherit;
}
.solution-card:hover{
  transform: translateY(-1px);
  border-color: rgba(47,127,111,.26);
  background: rgba(47,127,111,.08);
}
.solution-k{
  margin:0;
  font-size: 11.5px;
  letter-spacing: .18em;
  color: rgba(17,17,17,.62);
}
.solution-t{
  margin: 6px 0 6px;
  font-weight: 800;
  line-height: 1.6;
  color: rgba(17,17,17,.90);
}
.solution-d{
  margin:0;
  font-size: 13px;
  line-height: 1.9;
  color: rgba(17,17,17,.70);
}
.solution-tags{
  margin: 10px 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap: 6px;
}
.solution-tags li{
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(47,127,111,.20);
  background: rgba(255,255,255,.88);
  color: rgba(17,17,17,.64);
}

/* =========================================================
  System panel（考え方 / 進め方）
========================================================= */
.system-panel{
  margin-top: 18px;
  padding: 18px;
  background:
    radial-gradient(720px 320px at 18% 22%, rgba(67,160,142,.12), transparent 62%),
    rgba(255,255,255,.90);
}
.system-panel::after{ opacity:.12; }

.system-wrap{
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: stretch;
}
@media (min-width: 920px){
  .system-wrap{ grid-template-columns: 1.15fr .85fr; gap: 18px; }
}
.system-visual{
  border-radius: 24px;
  overflow:hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
}
.system-visual img{
  width:100%;
  height: 100%;
  min-height: 260px;
  object-fit: cover;
  display:block;
}

.system-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
  margin-bottom: 10px;
}
.system-kicker{
  margin:0;
  font-size: 11.5px;
  letter-spacing: .18em;
  color: rgba(47,127,111,.92);
  text-transform: uppercase;
}
.system-title{
  margin: 6px 0 0;
  font-family:"Noto Serif JP", serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.65;
  color: rgba(17,17,17,.90);
}
.system-lead{
  margin: 8px 0 0;
  font-size: 13.5px;
  line-height: 1.95;
  color: rgba(17,17,17,.70);
}
.system-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.system-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 12px;
}
@media (min-width: 920px){
  .system-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.system-card{
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  padding: 14px;
}
.system-card .k{
  margin:0 0 6px;
  font-size: 12px;
  letter-spacing: .14em;
  color: rgba(26,26,26,.60);
}
.system-card .t{
  margin:0 0 6px;
  font-weight: 800;
  color: rgba(17,17,17,.90);
}
.system-card .d{
  margin:0;
  font-size: 13px;
  line-height: 1.9;
  color: rgba(17,17,17,.68);
}

.north-callout{
  margin-top: 18px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.44);
  box-shadow: 0 16px 34px rgba(0,0,0,.08);
  padding: 16px 16px;
  position: relative;
  overflow:hidden;
  z-index: 1;
}
.north-callout::after{
  content:"";
  position:absolute; inset:0;
  background-image: var(--noise);
  opacity:.60;
  mix-blend-mode:multiply;
  pointer-events:none;
}
.north-callout::before{
  content:"";
  position:absolute;
  left: 14px; right: 14px; top: 12px;
  height: 1px;
  border-top: 1px dashed rgba(0,0,0,.22);
  opacity:.55;
}
.north-callout > *{ position: relative; z-index: 1; }
.north-k{
  margin: 0 0 8px;
  text-align:center;
  font-size: 12px;
  letter-spacing: .26em;
  color: rgba(26,26,26,.55);
}
.north-t{
  margin: 0;
  text-align:center;
  font-size: 15px;
  color: rgba(26,26,26,.70);
  line-height: 2.0;
  font-family:"Noto Serif JP","Noto Sans JP",serif;
}

/* =========================================================
  Instagram panel（トップのプレビュー）
========================================================= */
.ig-panel{
  padding: 18px;
  background:
    radial-gradient(720px 320px at 18% 22%, rgba(67,160,142,.14), transparent 62%),
    rgba(255,255,255,.90);
}
.ig-panel::after{ opacity:.22; }

.ig-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}
.ig-profile{ display:flex; gap: 10px; align-items:center; }
.ig-mark{
  width: 40px; height: 40px;
  border-radius: 14px;
  background:
    radial-gradient(18px 18px at 35% 30%, rgba(255,255,255,.85), transparent 60%),
    linear-gradient(180deg, rgba(67,160,142,.95), rgba(47,127,111,.95));
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.08);
}
.ig-name{ margin:0; font-weight: 800; color: rgba(17,17,17,.88); }
.ig-note{ margin:2px 0 0; font-size: 13px; color: rgba(17,17,17,.66); }
.ig-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.ig-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}
@media (min-width: 820px){
  .ig-grid{ grid-template-columns: repeat(6, minmax(0,1fr)); }
}
.ig-card{
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 22px rgba(0,0,0,.05);
  aspect-ratio: 1 / 1;
  display:grid;
  place-items:center;
  text-decoration:none;
  color: rgba(17,17,17,.55);
}
.ig-card:hover{
  transform: translateY(-1px);
  border-color: rgba(47,127,111,.18);
}
.ig-mini{
  margin: 10px 0 0;
  font-size: 12.5px;
  color: rgba(17,17,17,.60);
}

/* =========================================================
  Access panel（地図/写真）
========================================================= */
.access-panel{
  padding: 18px;
  background:
    radial-gradient(720px 320px at 12% 22%, rgba(244,183,64,.12), transparent 62%),
    rgba(255,255,255,.90);
}
.access-panel::after{ opacity:.14; }

.access-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
}
@media (min-width: 920px){
  .access-grid{ grid-template-columns: 1.05fr .95fr; }
}
.access-k{
  margin:0;
  font-size: 11.5px;
  letter-spacing:.18em;
  color: rgba(47,127,111,.92);
}
.access-t{
  margin: 6px 0 10px;
  font-family:"Noto Serif JP", serif;
  font-size: 18px;
  font-weight: 800;
  color: rgba(17,17,17,.90);
}
.access-dl{ margin:0; }
.access-dl > div{
  display:grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  padding: 10px 0;
  border-top: 1px dashed rgba(0,0,0,.16);
}
.access-dl > div:first-child{ border-top: 0; }
.access-dl dt{
  font-weight: 800;
  color: rgba(17,17,17,.78);
}
.access-dl dd{
  margin:0;
  color: rgba(17,17,17,.68);
  line-height: 1.9;
}
.access-actions{ margin-top: 12px; display:flex; gap:10px; flex-wrap:wrap; }
.access-note{ margin: 10px 0 0; font-size: 13px; color: rgba(17,17,17,.66); line-height: 1.9; }

.access-map{
  border-radius: 24px;
  overflow:hidden;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
  background: rgba(255,255,255,.92);
}
.access-map iframe{
  width:100%;
  height: 280px;
  border:0;
  display:block;
}
@media (min-width: 920px){
  .access-map iframe{ height: 320px; }
}
.access-photos{
  margin-top: 12px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.access-photo{
  margin:0;
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
}
.access-photo img{
  width:100%;
  height: 150px;
  object-fit: cover;
  display:block;
}
.access-photo figcaption{
  font-size: 12px;
  color: rgba(17,17,17,.62);
  padding: 8px 10px;
}

/* =========================================================
  Team panel（トップのミニ一覧）
========================================================= */
.team-min{
  margin-top: 18px;
  padding: 18px;
  background:
    radial-gradient(720px 320px at 18% 22%, rgba(67,160,142,.12), transparent 62%),
    rgba(255,255,255,.90);
}
.team-min::after{ opacity:.14; }

.team-minHead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}
.team-minK{
  margin:0;
  font-size: 11.5px;
  letter-spacing:.18em;
  color: rgba(47,127,111,.92);
}
.team-minT{
  margin: 6px 0 0;
  font-family:"Noto Serif JP", serif;
  font-size: 16px;
  font-weight: 800;
  color: rgba(17,17,17,.90);
}
.team-minLead{
  margin: 8px 0 0;
  max-width: 90ch;
  font-size: 13.5px;
  line-height: 1.95;
  color: rgba(17,17,17,.70);
}
.team-minActions{ display:flex; gap:10px; flex-wrap:wrap; }

.team-list{
  margin-top: 12px;
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 920px){
  .team-list{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.titem{
  display:flex;
  gap: 12px;
  align-items:center;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  padding: 12px;
  color: inherit;
}
.titem:hover{
  transform: translateY(-1px);
  border-color: rgba(47,127,111,.22);
}
.tavatar img{
  width: 54px;
  height: 54px;
  border-radius: 18px;
  object-fit: cover;
  display:block;
  border: 1px solid rgba(0,0,0,.08);
}
.tmeta{ min-width:0; }
.tname{ margin:0; font-weight: 900; color: rgba(17,17,17,.90); }
.trole{ margin:2px 0 0; font-size: 12.5px; color: rgba(17,17,17,.66); }
.tcat{
  margin: 6px 0 0;
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid rgba(47,127,111,.18);
  background: rgba(47,127,111,.06);
  color: rgba(17,17,17,.72);
  white-space: nowrap;
}
.tcat.is-tax{ border-color: rgba(244,183,64,.22); background: rgba(244,183,64,.10); }
.tcat.is-labor{ border-color: rgba(67,160,142,.20); background: rgba(67,160,142,.08); }
.tcat.is-web{ border-color: rgba(184,138,26,.22); background: rgba(184,138,26,.10); }

.team-noteSmall{
  margin: 12px 0 0;
  font-size: 12.5px;
  color: rgba(17,17,17,.60);
  line-height: 1.9;
}

/* =========================================================
  Team panel（トップのミニ一覧） ブラッシュアップ
========================================================= */

/* 3カラムでも高さが揃いやすいように */
.team-list{
  gap: 12px; /* 10 → 12（少しだけ余白を足して上品に） */
}

/* カード全体：密度と整列感UP */
.titem{
  position: relative;
  gap: 14px;                 /* 12 → 14 */
  padding: 14px;             /* 12 → 14 */
  border-radius: 20px;       /* 18 → 20 */
  border: 1px solid rgba(0,0,0,.10);
  background:
    radial-gradient(240px 140px at 20% 20%, rgba(244,183,64,.10), transparent 60%),
    rgba(255,255,255,.88);
  box-shadow: 0 12px 26px rgba(0,0,0,.05);
  align-items: center;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.titem:hover{
  transform: translateY(-2px);
  border-color: rgba(47,127,111,.22);
  box-shadow: 0 18px 40px rgba(0,0,0,.08);
  background:
    radial-gradient(260px 160px at 20% 20%, rgba(244,183,64,.12), transparent 60%),
    rgba(255,255,255,.92);
}

/* 写真：サイズUP + 形を統一して“きちんと感” */
.tavatar{
  flex: 0 0 auto;
}

.tavatar img{
  width: 72px;               /* 54 → 72（写真を大きく） */
  height: 72px;              /* 54 → 72 */
  border-radius: 20px;       /* 18 → 20（他の角丸トーンと合わせる） */
  object-fit: cover;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  background: rgba(255,255,255,.92);
}

/* 文字情報：上下のリズムを整える */
.tmeta{
  min-width: 0;
  display: grid;
  gap: 4px;                  /* 余白の粒度を揃える */
}

.tname{
  margin: 0;
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(17,17,17,.92);
  line-height: 1.25;
}

.trole{
  margin: 0;
  font-size: 12.5px;
  color: rgba(17,17,17,.62);
  line-height: 1.35;
}

/* カテゴリ：少しだけ“バッジ感”UP */
.tcat{
  margin: 4px 0 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid rgba(47,127,111,.18);
  background: rgba(47,127,111,.06);
  color: rgba(17,17,17,.72);
  white-space: nowrap;
}

/* 小さなアクセント点（trust-badgeのトーンと合わせる） */
.tcat::before{
  content:"";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 5px rgba(244,183,64,.10);
}

/* 既存の色分けクラスはそのまま活かす */
.tcat.is-tax{ border-color: rgba(244,183,64,.22); background: rgba(244,183,64,.10); }
.tcat.is-labor{ border-color: rgba(67,160,142,.20); background: rgba(67,160,142,.08); }
.tcat.is-web{ border-color: rgba(184,138,26,.22); background: rgba(184,138,26,.10); }

/* SP：写真が大きくなった分、横幅が狭い端末は少し戻す */
@media (max-width: 420px){
  .tavatar img{
    width: 64px;
    height: 64px;
    border-radius: 18px;
  }
  .titem{
    padding: 12px;
    gap: 12px;
  }
}


/* =========================
  Hero body compact patch
  ========================= */

/* 本文カードを軽く・小さく */
.hero-lead{
  margin-top: 10px;
  padding: 10px 12px 10px 14px;   /* 14→10に */
  line-height: 1.75;              /* 1.95→1.75に */
  border-left-width: 2px;          /* 3→2で軽く */
  border-radius: 12px;
  background: rgba(255,255,255,.52); /* 0.62→0.52で馴染ませる */
  box-shadow: 0 8px 18px rgba(0,0,0,.04); /* 影を弱く */
}


/* チップ列を少し圧縮 */
.hero-badgeRow{
  margin-top: 10px;   /* 14→10 */
  gap: 6px 8px;       /* 8→少し詰める */
}

/* チップ自体を薄く・小さく */
.hero-chip{
  padding: 6px 10px;            /* 7 11 → 6 10 */
  font-size: 11.5px;            /* 12→11.5 */
  box-shadow: 0 8px 16px rgba(0,0,0,.04);
}

/* CTAの間隔を詰める */
.hero-ctaWrap{
  margin-top: 12px;  /* 18→12 */
  gap: 10px;
}

/* PC：行数を少し減らしてコンパクト化 */
@media (min-width:901px){
  .hero-lead{
    -webkit-line-clamp: 4; /* 5→4 */
  }
  .hero-badgeRow{
    max-height: 70px; /* 78→70 */
  }
}

/* =========================================================
  Hero 修正パッチ（2026-02）
========================================================= */

/* 1) 見出しを「もうちょっとだけ」大きく */
.hero-title{
  font-size: clamp(28px, 4.2vw, 40px); /* 26-36 → 28-40 */
}

/* 2) 本文ボックスの下が切れる問題を解消（line-clamp/overflowを解除） */
@media (min-width:901px){
  .hero-lead{
    display:block;              /* -webkit-box をやめる */
    -webkit-line-clamp:unset;   /* 行数制限解除 */
    overflow:visible;           /* hidden解除 */
  }
}

/* 3) 本文ボックスを上へ（ARRANGE & SYNERGY に近づける） */
@media (min-width:901px){
  .hero-en{ margin-top:6px; }
  .hero-lead{ margin-top:6px; }   /* 10px → 6px */
  .hero-body{ margin-top:-4px; }  /* さらに少しだけ上げる */
}

/* 4) 「◎」と次の文字が割れないように（念のため） */
.hero-lead{ word-break: normal; }
.hero-lead{ overflow-wrap: anywhere; } /* 長文の逃げ道は確保 */

/* 5) タグ 2×2 + 右にボタン */
.hero-actions{
  margin-top:14px;
  display:grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items:start;
}

.hero-badgeGrid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.hero-ctaSide{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  flex-wrap:wrap;
}

/* ボタンが縦に伸び過ぎないように */
.hero-ctaSide .btn{
  white-space:nowrap;
}

/* 既に相談するを消しているならそのままでOK（残すなら外してください） */
/* .hero-ctaSide .btn--ghost{ display:none; } */

/* SP は縦積み（自然な挙動） */
@media (max-width:900px){
  .hero-actions{
    grid-template-columns: 1fr;
  }
  .hero-badgeGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hero-ctaSide{
    justify-content:flex-start;
  }
}