/*
Theme Name: AON
Theme URI: https://aon-solution.co.jp/
Author: 株式会社アオン
Author URI: https://aon-solution.co.jp/
Description: 株式会社アオンのコーポレートサイト用カスタムテーマ。AI/DX/Web/SNS/システム開発の7サービス、料金/保守/セキュリティページ、News/Works CPTを含む。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: Proprietary
Text Domain: aon
*/

@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&family=Archivo:wght@400;500;600;800&family=Instrument+Serif:ital@0;1&display=swap');
:root{
  --blue-900:#031A3D;--blue-800:#082A5E;--blue-700:#0B3B8C;--blue-600:#1E54C4;
  --blue-500:#2F6FE8;--blue-400:#5B8DF2;--blue-100:#DDEAFF;--blue-50:#F2F7FF;
  --cyan:#22D3EE;--ink:#0A1024;--gray-700:#3C4A63;--gray-500:#6B7690;
  --gray-300:#C7CEDC;--gray-100:#EEF1F7;--white:#FFFFFF;
  --radius:14px;--ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;color:var(--ink);background:var(--white);line-height:1.8;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.en{font-family:'Archivo',sans-serif;letter-spacing:.02em}
.serif{font-family:'Instrument Serif',serif;font-style:italic;letter-spacing:-.01em}
a{color:inherit;text-decoration:none}

/* ───── Nav ───── */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:18px 48px;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid rgba(10,16,36,.06)}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:20px;letter-spacing:.02em}
.logo-mark{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--blue-700),var(--blue-500));position:relative;display:grid;place-items:center;box-shadow:0 8px 20px -8px rgba(30,84,196,.6)}
.logo-mark::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--white);box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.nav-links{display:flex;gap:34px;list-style:none;font-size:14px;font-weight:500}
.nav-links a{color:var(--gray-700);transition:color .2s}
.nav-links a:hover,.nav-links a.active,.nav-links .current-menu-item > a,.nav-links .current_page_item > a{color:var(--blue-700)}
.nav-cta{padding:10px 22px;border-radius:999px;background:var(--ink);color:var(--white);font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:8px;transition:transform .25s var(--ease),background .25s}
.nav-cta:hover{transform:translateY(-1px);background:var(--blue-700)}

/* ───── Page Hero (subpages) ───── */
.page-hero{padding:160px 48px 80px;background:radial-gradient(800px 400px at 80% 20%,rgba(47,111,232,.08),transparent 60%),var(--white);border-bottom:1px solid var(--gray-100)}
.page-hero .container{max-width:1280px;margin:0 auto}
.page-hero .breadcrumb{font-size:12px;color:var(--gray-500);margin-bottom:20px;display:flex;gap:8px;align-items:center}
.page-hero .breadcrumb a{color:var(--blue-600)}
.page-hero .breadcrumb span{color:var(--gray-300)}
.page-hero h1{font-size:clamp(32px,4vw,52px);font-weight:900;line-height:1.25;letter-spacing:-.01em;margin-bottom:16px}
.page-hero h1 .serif{color:var(--blue-600);font-weight:400}
.page-hero p{font-size:16px;color:var(--gray-700);max-width:700px;line-height:1.9}

/* ───── Sections ───── */
.section{padding:120px 48px;position:relative}
.container{max-width:1280px;margin:0 auto}
.section-head{text-align:center;max-width:780px;margin:0 auto 70px}
.section-tag{display:inline-block;font-family:'Archivo',sans-serif;font-size:12px;font-weight:600;color:var(--blue-600);letter-spacing:.2em;text-transform:uppercase;margin-bottom:18px;position:relative;padding-left:28px}
.section-tag::before{content:"";position:absolute;left:0;top:50%;width:18px;height:1px;background:var(--blue-600)}
h2.section-title{font-size:clamp(30px,3.4vw,46px);font-weight:800;line-height:1.3;letter-spacing:-.01em;margin-bottom:20px}
h2.section-title .serif{color:var(--blue-600);font-weight:400}
.section-lead{color:var(--gray-700);font-size:16px;line-height:1.95}

/* ───── Buttons ───── */
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:999px;font-weight:600;font-size:15px;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.btn-primary{background:var(--ink);color:var(--white);box-shadow:0 14px 30px -12px rgba(10,16,36,.4)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 40px -14px rgba(30,84,196,.55);background:var(--blue-700)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--gray-300)}
.btn-ghost:hover{border-color:var(--blue-500);color:var(--blue-700)}
.btn-blue{background:var(--blue-700);color:var(--white)}
.btn-blue:hover{background:var(--blue-600);transform:translateY(-2px)}
.btn-arrow{display:inline-block;transition:transform .25s var(--ease)}
.btn:hover .btn-arrow{transform:translateX(4px)}
.btn-sm{padding:10px 20px;font-size:13px}
.link-arrow{font-family:'Archivo',sans-serif;font-size:13px;font-weight:600;color:var(--blue-600);display:inline-flex;align-items:center;gap:8px;letter-spacing:.05em;transition:gap .3s}
.link-arrow:hover{gap:14px;color:var(--blue-700)}

/* ───── Cards ───── */
.card{background:var(--white);border:1px solid rgba(30,84,196,.1);border-radius:20px;padding:36px 32px;transition:all .35s var(--ease);position:relative;overflow:hidden}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue-700),var(--cyan));transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.card:hover{transform:translateY(-6px);box-shadow:0 30px 60px -20px rgba(30,84,196,.2);border-color:rgba(30,84,196,.25)}
.card:hover::before{transform:scaleX(1)}

/* ───── Footer ───── */
footer{background:var(--ink);color:rgba(255,255,255,.6);padding:80px 48px 40px;font-size:13px}
.foot{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:60px;padding-bottom:50px;border-bottom:1px solid rgba(255,255,255,.08)}
.foot-brand .logo{color:var(--white);margin-bottom:18px}
.foot-brand p{line-height:1.9;max-width:280px}
.foot h5{color:var(--white);font-size:13px;font-weight:700;margin-bottom:18px;letter-spacing:.05em}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.foot a{color:rgba(255,255,255,.6);transition:color .2s}
.foot a:hover{color:var(--blue-400)}
.foot-bottom{max-width:1280px;margin:0 auto;padding-top:30px;display:flex;justify-content:space-between;font-size:12px}
.foot-bottom .en{color:rgba(255,255,255,.4)}

/* ───── Animations ───── */
.fade-up{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.fade-up.in{opacity:1;transform:translateY(0)}

/* ───── Dark section ───── */
.dark{background:var(--ink);color:var(--white);position:relative;overflow:hidden}
.dark::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 400px at 10% 20%,rgba(47,111,232,.22),transparent 60%),radial-gradient(600px 400px at 90% 90%,rgba(34,211,238,.12),transparent 60%)}
.dark .section-tag{color:var(--blue-400)}.dark .section-tag::before{background:var(--blue-400)}
.dark h2,.dark h3{color:var(--white)}.dark .section-lead{color:rgba(255,255,255,.7)}

/* ───── WP admin bar offset ───── */
.admin-bar .nav{top:32px}
@media screen and (max-width:782px){.admin-bar .nav{top:46px}}

/* ───── Responsive ───── */
@media(max-width:960px){
  .nav{padding:14px 20px}.nav-links{display:none}
  .page-hero{padding:130px 20px 60px}
  .section{padding:80px 20px}
  .foot{grid-template-columns:1fr 1fr;gap:40px}
}
