@charset "utf-8";
:root { --navy:#0b2d43; --blue:#0c6090; --accent:#26ace0; --pale:#eef9ff; --line:#cde5f2; }
* { box-sizing: border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--navy); background:#fff; font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; font-weight:400; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
button {font:inherit;}
.skip-link { position:absolute; left:8px; top:-60px; background:#fff; color:#083b60; padding:10px 16px; z-index:20; }
.skip-link:focus { top:8px; }
.site-header { height:70px; background:linear-gradient(105deg,#fff 48%, #f2faff 100%); display:flex; align-items:center; justify-content:space-between; padding:0 24px; position:relative; z-index:9; max-width:1200px; margin:0 auto; }
.logo-link {display:block; line-height:0; }
.brand-logo { display:block; width:195px; height:auto; }
.menu-toggle {appearance:none; border:0; cursor:pointer; background:transparent; width:44px; height:44px; padding:10px; display:flex; flex-direction:column; justify-content:center; gap:5px;}
.menu-toggle span { display:block; height:2.5px; width:26px; background:#0b4770; border-radius:8px; transition:transform .2s,opacity .2s; }
.menu-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7.5px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg);}
.site-menu {position:absolute; right:18px; top:66px; min-width:210px; padding:12px; border:1px solid #d1e8f6; border-radius:10px; background:rgba(255,255,255,.98); box-shadow:0 12px 40px #07385b23; z-index:11;}
.site-menu:not([hidden]) {display:flex; flex-direction:column; }
.site-menu a {text-decoration:none; padding:12px; font-size:14px; border-radius:7px;}
.site-menu a:hover,.site-menu a:focus-visible { background:#e5f5ff; }
.hero {position:relative; max-width:1200px; margin:0 auto; overflow:hidden; isolation:isolate; min-height:730px; display:flex; align-items:flex-start; background: #b0ddfb url("assets/sky-approved-style.webp") center center / cover no-repeat;}
.hero::before {content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(237,249,255,.22) 0%,rgba(240,250,255,.26) 57%,rgba(244,250,255,.03) 95%); z-index:-1;}
.hero-inner { width:min(100%,630px); margin:0 auto; padding:102px 44px 88px; }
.hero-title { color:#09518e; font-family:"Klee One","Yu Kyokasho","Hiragino Maru Gothic ProN","Noto Serif JP",cursive; font-size:clamp(38px,6vw,56px); font-weight:400; line-height:1.45; letter-spacing:-.05em; margin:0; transform:rotate(-5deg); transform-origin:center; text-align:left; }
.hero-title span {display:block; white-space:nowrap;}
.hero-title span+span {margin-top:4px;}
.scribble {display:block; width:90%; height:34px; margin:3px 0 16px 0; color:#3abce9; overflow:visible;}
.hero-message {font-size:18px; line-height:1.9; letter-spacing:.012em; color:#142d41; text-wrap:pretty;}
.hero-message p {margin:0 0 25px;}
.hero-message p:last-child {margin-bottom:0;}
.section {max-width:1200px; margin:0 auto; }
.content-width {width:min(100%,840px); padding:0 28px; margin:0 auto;}
.business-section {padding:36px 0 18px; background:white;}
.eyebrow {font-size:13px; font-weight:700; letter-spacing:.025em; color:#118dca; margin:0 0 9px;}
.section-title {position:relative; font-size:28px; font-weight:800; letter-spacing:.005em; line-height:1.3; padding:0 0 15px; margin:0 0 26px;}
.section-title::after{content:""; position:absolute; width:35px; height:2px; background:#1ba7db; left:0; bottom:3px;}
.service-cards {display:grid; grid-template-columns:1fr; gap:15px;}
.service-card {border:1px solid #c4e0f1; border-radius:14px; background:linear-gradient(130deg,#f4fbff 0%,#f0f9fe 100%); padding:23px 18px; display:grid; grid-template-columns:54px 1fr; column-gap:14px; align-items:start;}
.service-icon {width:54px;height:54px;border-radius:100%;background:#d7effa;display:grid;place-items:center;}
.service-icon svg{width:35px;height:35px;stroke:#0879bc;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;}
.service-copy h3{font-size:20px;line-height:1.35;margin:0 0 8px;font-weight:800;letter-spacing:0;}
.service-copy p{font-size:14px;line-height:1.8;color:#577387;margin:0;}
.company-section {background:#f1f9fe;padding:34px 0 27px;}
.company-section .section-title{margin-bottom:18px;}
.company-list{margin:0; padding:0; border-top:1px solid #c0dcea;}
.company-row{display:grid;grid-template-columns:104px 1fr;gap:10px;padding:15px 0;border-bottom:1px solid #c0dcea;font-size:14px;line-height:1.75;}
.company-row dt{font-weight:700;}
.company-row dd{margin:0;}
.contact-section {background:linear-gradient(120deg,#e8f7ff 0%,#dbf0fa 100%);padding:26px 0 21px;}
.contact-section .section-title{margin-bottom:6px;}
.contact-desc{font-size:15px;line-height:1.7;color:#557284;margin:0 0 8px;}
.contact-button{display:block;width:100%;border:0;border-radius:999px;color:#fff;background:linear-gradient(90deg,#0b5681 0%,#0c638d 100%);height:40px;font-size:15px;font-weight:700;}
.contact-button{display:flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer;}
.contact-button:focus-visible{outline:3px solid #0b2d43;outline-offset:3px;}
.site-footer { max-width:1200px;margin:0 auto;background:#fff;padding:14px 0 20px;}
.footer-logo {display:block;width:150px;height:auto;margin:0 0 8px;}
.site-footer p {font-size:11px;color:#97a9b6;margin:0;}
@media(max-width:540px){
  .site-header {height:56px;padding:0 19px;}
  .brand-logo {width:160px;}
  .menu-toggle{width:35px;height:38px;padding:4px;}
  .menu-toggle span{width:25px;}
  .site-menu {top:54px;right:10px;}
  .hero {min-height:0;}
  .hero-inner {padding:71px 30px 55px;}
  .hero-title {font-size:clamp(32px,9.8vw,43px);line-height:1.38;}
  .hero-title span+span {margin-top:5px;}
  .scribble {width:92%;height:29px;margin:8px 0 16px;}
  .hero-message {font-size:13.3px;line-height:1.85;}
  .hero-message p{margin:0 0 18px;}
  .business-section {padding:28px 0 12px;}
  .content-width {padding-left:28px;padding-right:28px;}
  .eyebrow {font-size:11px;margin-bottom:8px;}
  .section-title {font-size:25px;padding-bottom:13px;margin-bottom:24px;}
  .service-cards {gap:10px;}
  .service-card {grid-template-columns:43px 1fr;padding:18px 13px;column-gap:12px;}
  .service-icon{width:43px;height:43px;}
  .service-icon svg{width:28px;height:28px;}
  .service-copy h3{font-size:16px;margin-bottom:6px;}
  .service-copy p{font-size:12px;line-height:1.8;}
  .company-section {padding:26px 0 20px;}
  .company-row {grid-template-columns:77px 1fr;gap:8px;font-size:12.5px;padding:12px 0;}
  .contact-section{padding:25px 0 14px;}
  .contact-desc{font-size:13.6px;}
  .contact-button{height:35px;font-size:13.5px;}
  .site-footer {padding:11px 0 17px;}
  .footer-logo{width:121px;}
  .site-footer p{font-size:9px;}
}
@media(min-width:900px){.hero-inner{padding-top:120px;padding-bottom:100px}.service-cards{grid-template-columns:1fr 1fr;}.hero{min-height:760px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.menu-toggle span{transition:none}}

/* v2: approved handwritten artwork + accessible, exact HTML heading */
.visually-hidden { position:absolute!important; width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important; }
.approved-handwriting { display:block; width:min(100%,535px); height:auto; margin:0 0 10px; object-fit:contain; }
@media(max-width:540px) {
 .hero-inner { padding-top:58px; padding-bottom:40px; }
 .approved-handwriting { width:100%; margin:0 0 3px; }
 .hero-message { font-size:13px;line-height:1.85; }
 .hero-message p {margin-bottom:14px;}
}