/*
Theme Name: ETHOS Navy
Theme URI: https://ethos-ltd.com/
Author: OpenAI for 有限会社エートス
Description: 有限会社エートス向けの紺を基調とした、軽量・レスポンシブ対応のオリジナルWordPressテーマです。ACF不要で、お知らせ、事業紹介、実績紹介、会社情報を管理できます。
Version: 1.0.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: ethos-navy
License: GNU General Public License v2 or later
*/

:root {
  --navy-950: #07182d;
  --navy-900: #0b213f;
  --navy-800: #12345b;
  --navy-700: #1c4d7a;
  --gold: #b89a5e;
  --gold-light: #d4bf91;
  --ink: #172033;
  --muted: #667085;
  --line: #dfe5ec;
  --surface: #f4f7fa;
  --white: #ffffff;
  --shadow: 0 16px 45px rgba(7, 24, 45, .10);
  --radius: 16px;
  --container: 1160px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--white);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}
body.admin-bar .site-header { top: 32px; }
img { max-width: 100%; height: auto; vertical-align: middle; }
a { color: var(--navy-700); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: var(--gold); }
button, input, textarea, select { font: inherit; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.screen-reader-text { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  color: var(--white);
  background: rgba(7, 24, 45, .96);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.header-inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.site-branding { display: flex; align-items: center; gap: 14px; min-width: 220px; }
.custom-logo { max-height: 48px; width: auto; }
.site-title { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; letter-spacing: .08em; }
.site-title a { color: var(--white); text-decoration: none; }
.site-description { margin: 2px 0 0; color: rgba(255,255,255,.68); font-size: .73rem; letter-spacing: .06em; }
.main-navigation { margin-left: auto; }
.main-navigation ul { list-style: none; display: flex; align-items: center; gap: 25px; padding: 0; margin: 0; }
.main-navigation a { color: var(--white); text-decoration: none; font-weight: 600; font-size: .92rem; white-space: nowrap; }
.main-navigation a:hover, .main-navigation .current-menu-item > a { color: var(--gold-light); }
.header-tel { color: var(--white); text-decoration: none; border-left: 1px solid rgba(255,255,255,.18); padding-left: 22px; font-weight: 700; white-space: nowrap; }
.header-tel small { display: block; color: rgba(255,255,255,.58); font-size: .64rem; letter-spacing: .15em; }
.menu-toggle { display: none; color: var(--white); background: transparent; border: 1px solid rgba(255,255,255,.35); border-radius: 8px; width: 44px; height: 44px; cursor: pointer; }
.menu-toggle span, .menu-toggle::before, .menu-toggle::after { content:""; display:block; width:20px; height:2px; margin:5px auto; background:currentColor; transition:.2s; }

.hero { position: relative; min-height: 650px; display: grid; align-items: center; overflow: hidden; color: var(--white); background: var(--navy-950); }
.hero::before { content:""; position:absolute; inset:0; background-image: var(--hero-image, linear-gradient(135deg, #07182d, #12345b)); background-size: cover; background-position:center; opacity:.65; }
.hero::after { content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(7,24,45,.94) 0%, rgba(7,24,45,.75) 48%, rgba(7,24,45,.22) 100%); }
.hero-inner { position: relative; z-index: 2; padding: 110px 0; }
.hero-kicker { display:inline-flex; align-items:center; gap:10px; margin:0 0 20px; color:var(--gold-light); font-size:.8rem; letter-spacing:.2em; font-weight:700; }
.hero-kicker::before { content:""; width:42px; height:1px; background:var(--gold); }
.hero h1 { max-width: 760px; margin:0 0 25px; font-family: Georgia, "Noto Serif JP", serif; font-size:clamp(2.3rem, 5.5vw, 4.7rem); line-height:1.2; letter-spacing:.03em; }
.hero-copy { max-width: 660px; color:rgba(255,255,255,.86); font-size:clamp(1rem, 1.4vw, 1.14rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:38px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:12px 26px; border:1px solid transparent; border-radius:999px; text-decoration:none; font-weight:700; transition:transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform:translateY(-2px); }
.button-gold { color:var(--navy-950); background:var(--gold-light); box-shadow:0 10px 30px rgba(184,154,94,.25); }
.button-gold:hover { color:var(--navy-950); background:#e2cfa5; }
.button-outline { color:var(--white); border-color:rgba(255,255,255,.55); }
.button-outline:hover { color:var(--white); background:rgba(255,255,255,.1); }

.section { padding: 96px 0; }
.section-soft { background: var(--surface); }
.section-navy { color:var(--white); background:var(--navy-900); }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:45px; }
.eyebrow { margin:0 0 8px; color:var(--gold); font-size:.75rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; }
.section-title { margin:0; color:var(--navy-950); font-family:Georgia,"Noto Serif JP",serif; font-size:clamp(1.8rem,3vw,2.7rem); line-height:1.35; }
.section-navy .section-title { color:var(--white); }
.section-lead { max-width:620px; margin:10px 0 0; color:var(--muted); }
.section-navy .section-lead { color:rgba(255,255,255,.7); }
.text-link { font-weight:700; text-decoration:none; white-space:nowrap; }

.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.service-card { position:relative; overflow:hidden; min-height:430px; border-radius:var(--radius); color:var(--white); background:var(--navy-800); box-shadow:var(--shadow); }
.service-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 25%,rgba(7,24,45,.95) 100%); }
.service-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.8; transition:transform .5s; }
.service-card:hover img { transform:scale(1.04); }
.service-card-content { position:absolute; z-index:2; left:0; right:0; bottom:0; padding:32px; }
.service-number { color:var(--gold-light); font-family:Georgia,serif; font-size:.8rem; letter-spacing:.18em; }
.service-card h3 { margin:8px 0 10px; font-size:1.35rem; }
.service-card p { margin:0; color:rgba(255,255,255,.78); font-size:.92rem; }

.about-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:70px; align-items:center; }
.about-visual { position:relative; min-height:470px; border-radius:var(--radius); overflow:hidden; background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); box-shadow:var(--shadow); }
.about-visual img { width:100%; height:100%; min-height:470px; object-fit:cover; }
.about-badge { position:absolute; right:24px; bottom:24px; width:150px; height:150px; display:grid; place-items:center; padding:18px; border-radius:50%; text-align:center; color:var(--navy-950); background:rgba(255,255,255,.94); font-family:Georgia,"Noto Serif JP",serif; box-shadow:var(--shadow); }
.about-content h2 { margin:0 0 22px; font-family:Georgia,"Noto Serif JP",serif; color:var(--navy-950); font-size:clamp(1.8rem,3vw,2.65rem); line-height:1.5; }
.about-points { display:grid; gap:13px; padding:0; margin:28px 0 0; list-style:none; }
.about-points li { position:relative; padding-left:28px; }
.about-points li::before { content:""; position:absolute; left:0; top:.72em; width:13px; height:2px; background:var(--gold); }

.works-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.work-card { overflow:hidden; border-radius:var(--radius); background:var(--white); box-shadow:var(--shadow); }
.work-thumb { display:block; aspect-ratio:4/3; overflow:hidden; background:#dce3ea; }
.work-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.work-card:hover .work-thumb img { transform:scale(1.035); }
.work-body { padding:24px; }
.work-meta { color:var(--gold); font-size:.75rem; font-weight:700; letter-spacing:.08em; }
.work-title { margin:7px 0 0; font-size:1.1rem; line-height:1.55; }
.work-title a { color:var(--ink); text-decoration:none; }

.news-list { border-top:1px solid var(--line); }
.news-item { display:grid; grid-template-columns:140px 110px 1fr; align-items:center; gap:20px; padding:22px 0; border-bottom:1px solid var(--line); }
.news-date { color:var(--muted); font-size:.88rem; }
.news-cat { display:inline-block; padding:4px 12px; border:1px solid var(--line); border-radius:999px; color:var(--navy-800); text-align:center; font-size:.75rem; }
.news-title { color:var(--ink); font-weight:600; text-decoration:none; }

.cta { position:relative; overflow:hidden; padding:75px 0; color:var(--white); background:linear-gradient(135deg,var(--navy-950),var(--navy-700)); }
.cta::after { content:"ETHOS"; position:absolute; right:-10px; bottom:-60px; color:rgba(255,255,255,.045); font:700 12rem/1 Georgia,serif; letter-spacing:.06em; }
.cta-inner { position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:40px; }
.cta h2 { margin:0 0 8px; font-family:Georgia,"Noto Serif JP",serif; font-size:clamp(1.7rem,3vw,2.5rem); }
.cta p { margin:0; color:rgba(255,255,255,.72); }
.cta-actions { display:flex; flex-wrap:wrap; gap:12px; }

.page-hero { padding:85px 0; color:var(--white); background:linear-gradient(135deg,var(--navy-950),var(--navy-700)); }
.page-hero .eyebrow { color:var(--gold-light); }
.page-title { margin:0; font-family:Georgia,"Noto Serif JP",serif; font-size:clamp(2rem,4vw,3.3rem); }
.breadcrumbs { margin-top:18px; color:rgba(255,255,255,.62); font-size:.8rem; }
.breadcrumbs a { color:rgba(255,255,255,.8); }
.content-wrap { width:min(calc(100% - 40px), 900px); margin:0 auto; padding:75px 0 100px; }
.entry-content > * { max-width:100%; }
.entry-content h2 { margin-top:2.2em; padding-bottom:.45em; border-bottom:2px solid var(--navy-900); color:var(--navy-950); font-family:Georgia,"Noto Serif JP",serif; }
.entry-content h3 { margin-top:1.8em; color:var(--navy-800); }
.entry-content table { width:100%; border-collapse:collapse; margin:25px 0; }
.entry-content th, .entry-content td { padding:14px 16px; border:1px solid var(--line); text-align:left; vertical-align:top; }
.entry-content th { width:25%; background:var(--surface); }
.entry-content .wp-block-image img { border-radius:12px; }
.entry-meta { color:var(--muted); font-size:.86rem; margin-bottom:30px; }
.post-navigation { display:grid; grid-template-columns:1fr 1fr; gap:15px; margin-top:55px; }
.post-navigation a { display:block; padding:18px; border:1px solid var(--line); border-radius:10px; text-decoration:none; }

.archive-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.pagination { margin-top:50px; }
.nav-links { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.page-numbers { display:grid; place-items:center; min-width:42px; min-height:42px; padding:6px; border:1px solid var(--line); border-radius:8px; text-decoration:none; }
.page-numbers.current { color:var(--white); background:var(--navy-800); border-color:var(--navy-800); }

.site-footer { color:rgba(255,255,255,.72); background:var(--navy-950); }
.footer-main { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:50px; padding:70px 0 55px; }
.footer-title { margin:0 0 13px; color:var(--white); font:1.45rem Georgia,serif; letter-spacing:.08em; }
.footer-heading { margin:0 0 15px; color:var(--gold-light); font-size:.78rem; letter-spacing:.14em; }
.footer-nav { list-style:none; padding:0; margin:0; }
.footer-nav li { margin:8px 0; }
.footer-nav a { color:rgba(255,255,255,.72); text-decoration:none; }
.footer-nav a:hover { color:var(--white); }
.footer-bottom { padding:20px 0; border-top:1px solid rgba(255,255,255,.1); font-size:.75rem; text-align:center; }
.pagetop { position:fixed; right:20px; bottom:20px; z-index:20; display:grid; place-items:center; width:46px; height:46px; border-radius:50%; color:var(--white); background:var(--navy-800); text-decoration:none; box-shadow:var(--shadow); }

.placeholder { display:grid; place-items:center; width:100%; height:100%; min-height:260px; color:rgba(255,255,255,.8); background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); font-family:Georgia,serif; letter-spacing:.12em; }
.alignwide { width:min(1100px,calc(100vw - 40px)); max-width:none; margin-left:50%; transform:translateX(-50%); }
.alignfull { width:100vw; max-width:none; margin-left:50%; transform:translateX(-50%); }

@media (max-width: 980px) {
  body.admin-bar .site-header { top:46px; }
  .header-inner { min-height:68px; }
  .menu-toggle { display:block; }
  .header-tel { display:none; }
  .main-navigation { position:absolute; top:100%; left:0; right:0; display:none; margin:0; padding:20px; background:var(--navy-950); border-top:1px solid rgba(255,255,255,.1); }
  .main-navigation.is-open { display:block; }
  .main-navigation ul { display:block; }
  .main-navigation li { border-bottom:1px solid rgba(255,255,255,.08); }
  .main-navigation a { display:block; padding:13px 2px; }
  .hero { min-height:580px; }
  .service-grid, .works-grid, .archive-grid { grid-template-columns:repeat(2,1fr); }
  .service-card:last-child { grid-column:1/-1; min-height:330px; }
  .about-grid { grid-template-columns:1fr; gap:42px; }
  .about-visual { min-height:380px; }
  .about-visual img { min-height:380px; }
  .footer-main { grid-template-columns:1fr 1fr; }
  .footer-main > :first-child { grid-column:1/-1; }
}

@media (max-width: 680px) {
  .container, .content-wrap { width:min(calc(100% - 28px), var(--container)); }
  .site-description { display:none; }
  .site-title { font-size:1.25rem; }
  .hero { min-height:540px; }
  .hero-inner { padding:85px 0; }
  .hero::after { background:rgba(7,24,45,.78); }
  .section { padding:70px 0; }
  .section-heading { display:block; }
  .section-heading .text-link { display:inline-block; margin-top:18px; }
  .service-grid, .works-grid, .archive-grid { grid-template-columns:1fr; }
  .service-card, .service-card:last-child { grid-column:auto; min-height:390px; }
  .news-item { grid-template-columns:1fr auto; gap:5px 12px; }
  .news-title { grid-column:1/-1; }
  .cta-inner { display:block; }
  .cta-actions { margin-top:25px; }
  .footer-main { grid-template-columns:1fr; gap:30px; }
  .footer-main > :first-child { grid-column:auto; }
  .entry-content th, .entry-content td { display:block; width:100%; }
  .entry-content th { border-bottom:0; }
  .post-navigation { grid-template-columns:1fr; }
  .about-badge { width:120px; height:120px; font-size:.82rem; }
}
