@charset "UTF-8";
/*
Theme Name: 株式会社アルナイル建設
Description: 株式会社アルナイル建設 コーポレート／採用サイト。豊橋の一般土木工事。デザイントークンはCSSカスタムプロパティ、ページごとにCSSを分割（/css）。
Author: ALNAIR
Version: 1.0.0
*/

/* =========================================================
   デザイントークン（モックアップ由来）
   ========================================================= */
:root {
  --navy-deep: #0a1c3d; /* 濃紺（誠実） */
  --navy:      #123a72; /* 紺 */
  --blue:      #1f74c4; /* ロゴ中間ブルー */
  --sky:       #4db8e8; /* 水色 */
  --sky-pale:  #eaf5fb;
  --amber:     #f39200; /* ロゴのオレンジ差し色 */
  --amber-deep:#e07a00;
  --ink:       #14203a; /* 本文 */
  --gray:      #5b6577; /* 補助テキスト */
  --line:      rgba(255, 255, 255, .14);
  --wht:       #ffffff;
  --ph:        linear-gradient(135deg, #1a3560, #0d2547 60%, #12305e); /* 画像プレースホルダ */
  --pc:        1200px;
}

/* =========================================================
   リセット
   ========================================================= */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 100%;
  scroll-behavior: smooth;
}

body {
  color: var(--ink);
  background: var(--wht);
  font-family: 'Zen Kaku Gothic New', 'メイリオ', Meiryo, sans-serif;
  line-height: 1.9;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  text-decoration: none;
  color: inherit;
}

ul,
li {
  list-style: none;
}

/* =========================================================
   フォントヘルパー
   ========================================================= */
.mincho { font-family: 'Shippori Mincho', serif; }
.en     { font-family: 'Chakra Petch', sans-serif; letter-spacing: .06em; }
.sora   { font-family: 'Sora', sans-serif; }

/* =========================================================
   テキスト装飾マーカー
   ========================================================= */
.mk {
  background: linear-gradient(transparent 62%, rgba(77, 184, 232, .4) 62%);
  padding: 0 2px;
  font-weight: 700;
}

.mk-amb {
  background: linear-gradient(transparent 62%, rgba(243, 146, 0, .35) 62%);
  padding: 0 2px;
  font-weight: 700;
}

.c-amb  { color: var(--amber); font-weight: 700; }
.c-blue { color: var(--blue); font-weight: 700; }
.c-navy { color: var(--navy-deep); font-weight: 700; }

.big-in {
  font-size: 1.35em;
  font-weight: 700;
  color: var(--navy-deep);
}

/* =========================================================
   スクロール表示アニメーション（既存 fade-in 互換）
   ========================================================= */
.fade-in {
  opacity: 0;
  transition-duration: .8s;
  transition-property: opacity, transform;
}

.fade-in-up   { transform: translate(0, 40px); }
.fade-in-down { transform: translate(0, -40px); }

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

/* reveal（新演出） */
.reveal {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity .9s ease, transform .9s ease;
}

.reveal.in {
  opacity: 1;
  transform: none;
}

/* 改行ヘルパー */
.sp-br { display: none; }

@media (max-width: 768px) {
  .sp-br { display: inline; }
}

/* =========================================================
   日本語の改行を自然に（孤立文字・不自然な折り返しを軽減）
   ========================================================= */
body { line-break: strict; }

/* 行末の孤立（1文字だけ落ちる等）を減らす */
h1, h2, h3, h4,
p, li, dt, dd,
.hero-sub, .msg-lead, .msg-body, .lead, .svc-lead, .svc-oneword,
.svc-intro, .greet-text, .greet h3, .origin h3, .origin p, .ct-intro,
.vq, .vtxt, .flow-body p, .req-row dd, .cta-band h2, .cta-band p,
.ws-title, .ws-body {
  text-wrap: pretty;
}

/* SP：文節単位で改行（対応ブラウザ）。未対応ブラウザは自動で通常改行 */
@media (max-width: 768px) {
  h1, h2, h3, h4,
  p, li, dt, dd,
  .hero-sub, .msg-lead, .lead, .svc-oneword, .svc-intro,
  .greet h3, .origin h3, .origin p, .ct-intro, .vq, .vtxt {
    word-break: auto-phrase;
  }
}