:root{
  --brand:#ff7a00; /* bright orange */
  --ink:#ffffff;   /* page background */
  --card:#f9fafb;  /* card background */
  --text:#2a2a2a;  /* main text */
  --muted:#6b7280; /* secondary text */
  --radius:20px;
  --shadow:0 6px 20px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{
  margin:0;padding:0;background:var(--ink);color:var(--text);
  font-family: "Noto Sans JP", Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Yu Gothic", sans-serif
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;border-radius:16px}
.container{width:min(1120px,94vw);margin:0 auto}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;border-radius:999px;padding:12px 18px;
  font-weight:800;background:var(--brand);color:#fff;border:0;box-shadow:var(--shadow);cursor:pointer;
  transition:opacity .2s
}
.btn:hover{opacity:.9}
.btn.ghost{background:transparent;border:2px solid var(--brand);color:var(--brand)}

/* Glass header */
header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.85);
  backdrop-filter:saturate(1.1) blur(10px);
  border-bottom:1px solid rgba(0,0,0,.06)
}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.nav .links{display:flex;gap:1rem;align-items:center}
.brand{display:flex;align-items:center;gap:.7rem}
.brand img{height:36px;width:auto;object-fit:contain}
.badge{
  display:inline-block;background:rgba(255,122,0,.10);border:1px solid rgba(255,122,0,.25);
  color:#b45309;padding:.28rem .6rem;border-radius:999px;font-size:.82rem
}

/* Sections */
section{padding:56px 0;border-top:1px solid rgba(0,0,0,.05)}
h1,h2,h3{color:#1f2937}
h2{font-size:clamp(22px,3vw,32px);margin:0 0 10px}
.muted{color:var(--muted)}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.card{background:var(--card);border:1px solid rgba(0,0,0,.05);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}

.stat{
  background:var(--card);border:1px solid rgba(0,0,0,.06);
  padding:12px 14px;border-radius:14px;min-width:140px;text-align:center
}

/* Footer */
footer{padding:26px 0;color:#6b7280;background:#f3f4f6;border-top:1px solid rgba(0,0,0,.05)}

/* Responsive */
@media (max-width:920px){
  .grid-3{grid-template-columns:1fr 1fr}
  .grid-2{grid-template-columns:1fr}
}
@media (max-width:600px){
  .grid-3{grid-template-columns:1fr}
}


/* Photo area for page-level images */
.photo-area{margin:14px 0 24px}
.photo-area img{width:100%;height:auto;border-radius:16px;box-shadow:0 6px 20px rgba(0,0,0,.08);display:block}

/* SNS row */
.sns a{width:44px;height:44px;border-radius:999px;display:grid;place-items:center;background:#fff;
  border:1px solid rgba(0,0,0,.08);box-shadow:0 3px 8px rgba(0,0,0,.06);transition:transform .15s}
.sns a:hover{transform:scale(1.06)}
@media (max-width:560px){.sns{gap:10px}}

/* smaller heading for 株式会社CHHについて and 私たちの提供価値 */
.small-heading {
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.4;
  font-weight: 600;
}

/* orange-white labels for section headings (not nav) */
.section-label {
  background-color: #FF7F00;
  color: #FFFFFF;
  display: inline-block;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-bottom: 8px;
}

/* section-label for orange background + white text */
.section-label {
  background-color: #FF7F00;
  color: #FFFFFF;
  display: inline-block;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-bottom: 8px;
}

/* refined section-label: white background, orange border, orange text */
.section-label {
  background-color: #FFFFFF;
  color: #FF7F00;
  border: 2px solid #FF7F00;
  display: inline-block;
  padding: 8px 18px;
  border-radius: 9999px; /* full oval look */
  font-weight: 700;
  letter-spacing: 0.03em;
  transition: all 0.2s ease-in-out;
}
.section-label:hover {
  background-color: #FF7F00;
  color: #FFFFFF;
}

/* section-label squared style */
.section-label {
  background-color: #FFFFFF;
  color: #FF7F00;
  border: 2px solid #FF7F00;
  display: inline-block;
  padding: 8px 16px;
  border-radius: 4px; /* square corners */
  font-weight: 700;
  letter-spacing: 0.03em;
  transition: all 0.2s ease-in-out;
}
.section-label:hover {
  background-color: #FF7F00;
  color: #FFFFFF;
}

/* revert section-label to orange background, white text */
.section-label {
  background-color: #FF7F00;
  color: #FFFFFF;
  border: none;
  display: inline-block;
  padding: 8px 16px;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 0.03em;
  transition: all 0.2s ease-in-out;
}
.section-label:hover {
  opacity: 0.85;
}