:root { --mint:#6bbfb5; --mint-dark:#4a9e94; --teal:#1a3a3a; --pale:#f0faf9; --ink:#203939; --line:rgba(107,191,181,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; }
body { margin:0; color:var(--ink); background:#fff; font-family:"Noto Sans JP",sans-serif; line-height:1.75; }
a { color:inherit; text-decoration:none; }
.container { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.site-header { position:fixed; top:0; z-index:10; width:100%; color:#fff; transition:.25s; }
.site-header.is-scrolled { background:rgba(255,255,255,.96); color:var(--teal); box-shadow:0 4px 22px rgba(20,55,55,.08); backdrop-filter:blur(12px); }
.nav { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:11px; line-height:1.15; }
.brand img { width:43px; height:43px; border-radius:50%; object-fit:contain; background:#fff; }
.brand strong { display:block; font-family:"Noto Serif JP",serif; font-size:14px; letter-spacing:.08em; }
.brand small { display:block; margin-top:4px; font-size:9px; letter-spacing:.17em; color:var(--mint); }
.nav-links { display:flex; align-items:center; gap:29px; font-size:13px; }
.nav-links a { opacity:.88; transition:.2s; }
.nav-links a:hover { opacity:1; color:var(--mint); }
.nav-links .nav-contact { padding:9px 18px; background:var(--mint); color:#fff; border-radius:999px; opacity:1; }
.menu-toggle { display:none; border:0; background:transparent; padding:9px; color:currentColor; }
.menu-toggle span { display:block; width:23px; height:2px; margin:5px; background:currentColor; }
.hero { position:relative; display:flex; align-items:center; min-height:100svh; color:#fff; background:center/cover url("assets/htg-hero-bg.jpg"); overflow:hidden; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(20,54,54,.85),rgba(20,54,54,.52) 52%,rgba(20,54,54,.20)),linear-gradient(0deg,rgba(20,54,54,.42),transparent 50%); }
.hero-content { position:relative; z-index:1; padding-top:64px; }
.eyebrow,.section-label { margin:0 0 18px; color:var(--mint); font-family:"Cormorant Garamond",serif; font-size:13px; font-weight:600; letter-spacing:.25em; text-transform:uppercase; }
.eyebrow span { display:inline-block; width:44px; height:1px; margin:0 14px 5px 0; background:var(--mint); }
h1,h2,h3 { line-height:1.45; }
h1 { margin:0; font-family:"Noto Serif JP",serif; font-size:clamp(42px,5.3vw,70px); letter-spacing:.03em; }
h1 em { color:var(--mint); font-style:normal; }
.hero-lead { max-width:590px; margin:28px 0 34px; font-size:16px; color:rgba(255,255,255,.85); }
.button-row { display:flex; flex-wrap:wrap; gap:14px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 29px; border:1px solid transparent; font-weight:700; font-size:14px; transition:.2s; }
.button.primary { background:var(--mint); color:#fff; border-radius:999px; box-shadow:0 8px 18px rgba(34,99,94,.22); }
.button.primary:hover { background:var(--mint-dark); transform:translateY(-2px); }
.button.primary b { margin-left:12px; font-size:18px; }
.button.secondary { color:#fff; border-color:rgba(255,255,255,.68); border-radius:999px; }
.button.secondary:hover { background:rgba(255,255,255,.12); }
.scroll-hint { position:absolute; left:50%; bottom:24px; z-index:1; display:grid; place-items:center; transform:translateX(-50%); color:rgba(255,255,255,.65); font:12px "Cormorant Garamond",serif; letter-spacing:.25em; }
.scroll-hint span { margin-top:2px; font-size:19px; }
.section { padding:112px 0; }
.mission,.company { background:var(--pale); }
.split-grid,.company-grid,.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:76px; align-items:center; }
h2 { margin:0 0 25px; color:var(--teal); font-family:"Noto Serif JP",serif; font-size:clamp(29px,3.5vw,44px); letter-spacing:.02em; }
blockquote { margin:33px 0 31px; padding:2px 0 2px 25px; border-left:4px solid var(--mint); color:#406060; font-family:"Noto Serif JP",serif; font-size:17px; }
.mission-pillars { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.mission-pillars div { text-align:center; font-size:12px; font-weight:500; }
.mission-pillars i { display:grid; width:48px; height:48px; margin:0 auto 8px; place-items:center; border-radius:14px; background:rgba(107,191,181,.12); color:var(--mint); font-size:22px; font-style:normal; }
.ceo-card { position:relative; padding:43px; overflow:hidden; border-radius:22px; background:var(--teal); color:#fff; }
.ceo-card::after { position:absolute; right:-50px; top:-55px; width:158px; height:158px; border-radius:50%; background:rgba(107,191,181,.11); content:""; }
.ceo-card .section-label { position:relative; z-index:1; }.ceo-card>p:nth-child(2) { position:relative; z-index:1; color:rgba(255,255,255,.9); }
.signature { position:relative; z-index:1; display:flex; gap:13px; align-items:center; margin-top:29px; padding-top:22px; border-top:1px solid rgba(255,255,255,.22); }
.signature-icon { display:grid; width:43px; height:43px; place-items:center; border-radius:50%; background:rgba(107,191,181,.2); color:var(--mint); }.signature strong,.signature small { display:block; }.signature strong { font-family:"Noto Serif JP",serif; }.signature small { color:rgba(255,255,255,.62); font-size:11px; }
.section-heading { max-width:665px; margin:0 auto 59px; text-align:center; }.section-heading>p:last-child { color:#61706f; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.service-card { overflow:hidden; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 5px 18px rgba(22,70,68,.04); transition:.25s; }.service-card:hover { transform:translateY(-6px); box-shadow:0 17px 30px rgba(22,70,68,.13); }
.image-card>img { display:block; width:100%; height:190px; object-fit:cover; }.service-content,.plain-card,.dark-card { padding:23px; }.service-icon { display:grid; width:43px; height:43px; margin-top:-46px; position:relative; place-items:center; border-radius:12px; background:var(--mint); color:#fff; font-size:20px; }.plain-card .service-icon,.dark-card .service-icon { margin:0 0 17px; }
.service-card h3 { margin:17px 0 7px; color:var(--teal); font-family:"Noto Serif JP",serif; font-size:18px; }.service-card p { margin:0 0 17px; color:#596969; font-size:13px; }.service-card ul { margin:0; padding:0; list-style:none; color:#667373; font-size:12px; }.service-card li { margin:6px 0; }.service-card li::before { margin-right:8px; color:var(--mint); content:"✓"; }.plain-card { background:var(--pale); }.dark-card { background:var(--teal); border-color:var(--teal); }.dark-card h3 { color:#fff; }.dark-card p,.dark-card ul { color:rgba(255,255,255,.68); }.dark-card .service-icon { background:rgba(107,191,181,.18); color:var(--mint); }
.profile-card { overflow:hidden; border:1px solid var(--line); border-radius:20px; background:#fff; }.profile-card dl { margin:0; }.profile-card dl>div { display:grid; grid-template-columns:155px 1fr; }.profile-card dl>div:nth-child(odd) { background:rgba(240,250,249,.7); }.profile-card dt,.profile-card dd { margin:0; padding:15px 22px; font-size:13px; }.profile-card dt { color:var(--mint-dark); font-weight:700; }.profile-card dd { color:var(--teal); }.profile-card dd a { color:var(--mint-dark); text-decoration:underline; }.location-stack { display:grid; gap:23px; }.location-stack iframe { width:100%; min-height:255px; border:0; border-radius:20px; }.address-card { padding:25px; border-radius:20px; background:var(--teal); color:#fff; }.address-card p { margin:10px 0 18px; color:rgba(255,255,255,.78); font-size:13px; }.address-card a { padding-top:14px; display:block; border-top:1px solid rgba(255,255,255,.19); color:var(--mint); font-size:13px; }
.contact-grid { align-items:start; max-width:940px; margin:auto; }.info-card,.language-card { padding:28px; border-radius:20px; }.info-card { background:var(--pale); border:1px solid var(--line); }.info-card h3,.language-card h3 { margin:0 0 18px; font-family:"Noto Serif JP",serif; font-size:18px; }.info-card p { display:grid; gap:4px; margin:17px 0; font-size:13px; }.info-card b { color:#708080; font-size:11px; }.info-card a { color:var(--teal); font-weight:600; }.language-card { margin-top:20px; background:var(--teal); color:#fff; }.language-card div { display:flex; gap:8px; }.language-card span { padding:4px 11px; border:1px solid rgba(107,191,181,.3); border-radius:50px; background:rgba(107,191,181,.15); color:var(--mint); font-size:11px; }.language-card p { color:rgba(255,255,255,.66); font-size:12px; }.contact-form { display:grid; gap:14px; }.contact-form label { color:var(--teal); font-size:12px; font-weight:600; }.contact-form label b { color:#dc7777; }.two-columns { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.contact-form input,.contact-form textarea { display:block; width:100%; margin-top:5px; padding:12px 13px; border:1px solid rgba(107,191,181,.35); border-radius:11px; outline:0; background:var(--pale); color:var(--teal); font:13px "Noto Sans JP",sans-serif; }.contact-form input:focus,.contact-form textarea:focus { border-color:var(--mint); box-shadow:0 0 0 3px rgba(107,191,181,.14); }.contact-form textarea { resize:vertical; }.form-note { margin:0; color:#778585; font-size:11px; }.full { width:100%; border:0; cursor:pointer; }
footer { padding:28px 0; background:#112e2e; color:#fff; }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:22px; }.footer-inner p { color:rgba(255,255,255,.56); font-size:11px; }
.reveal { animation:show .7s both; } @keyframes show { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
@media (max-width:900px) { .service-grid { grid-template-columns:repeat(2,1fr); }.split-grid,.company-grid,.contact-grid { gap:42px; }.nav-links { gap:17px; } }
@media (max-width:700px) { .container { width:min(100% - 30px,1120px); }.nav { min-height:68px; }.nav-links { position:absolute; top:68px; left:0; right:0; display:none; padding:16px; flex-direction:column; align-items:stretch; background:#fff; color:var(--teal); box-shadow:0 11px 18px rgba(20,55,55,.12); }.nav-links.open { display:flex; }.nav-links a { padding:8px 10px; }.nav-links .nav-contact { text-align:center; }.menu-toggle { display:block; }.hero { min-height:730px; }.section { padding:74px 0; }.split-grid,.company-grid,.contact-grid { grid-template-columns:1fr; }.service-grid { grid-template-columns:1fr; }.profile-card dl>div { grid-template-columns:118px 1fr; }.profile-card dt,.profile-card dd { padding:12px; font-size:12px; }.two-columns { grid-template-columns:1fr; }.footer-inner { align-items:flex-start; flex-direction:column; }.footer-inner p { margin:0; } }
