/* Hallmark · genre: editorial · design-system: design.md · designed-as-app
 * Warm, assured; existing teal / green / amber. Marquee hero + guided long document.
 * Pre-emit critique: P4 H4 E4 S5 R4 V4. */
:root {
  --experience-accent: var(--brand-d);
  --experience-soft: var(--brand-l);
  --experience-rule: var(--line);
  --experience-surface: #fbfdfc;
  --experience-glass: rgba(255,255,255,.96);
  --experience-shadow: 0 18px 48px rgba(20,51,47,.14);
  --experience-green: #23633e;
  --experience-line: #087b39;
  --experience-gold: #9b5919;
  --experience-amber: #ffdfa7;
  --experience-dark: #193936;
  --experience-light: #f4f8f5;
  --experience-veil: rgba(255,255,255,.2);
  --experience-fade-middle: rgba(255,255,255,.65);
  --experience-fade-edge: rgba(255,255,255,.06);
  --experience-mobile-middle: rgba(255,255,255,.83);
  --experience-mobile-edge: rgba(255,255,255,.35);
  --experience-caption: rgba(17,42,35,.55);
  --experience-ease: cubic-bezier(.16,1,.3,1);
  --experience-fast: 180ms;
  --experience-reveal: 620ms;
  --site-bar-height: 44px;
  --header-height: 76px;
  --chapter-height: 57px;
  --space-xs: .5rem; --space-sm: 1rem; --space-md: 1.5rem;
  --space-lg: 2rem; --space-xl: 3rem; --space-2xl: 5rem;
}
body[data-site="madoka"] { --experience-accent:var(--green-d); --experience-soft:var(--green-l); }
html,body { overflow-x:clip; }
html { scroll-padding-top:calc(var(--site-bar-height) + var(--header-height) + var(--chapter-height) + 20px); }
body { font-size:17px; }
h1,h2,h3 { font-style:normal; overflow-wrap:anywhere; min-width:0; text-wrap:balance; }
p { overflow-wrap:anywhere; }
a,button,summary { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--experience-accent); outline-offset:5px; }
.contact a:focus-visible,footer a:focus-visible { outline-color:var(--experience-amber); }
.btn { min-height:48px; white-space:nowrap; max-width:100%; transition:transform var(--experience-fast),box-shadow var(--experience-fast),background var(--experience-fast); }
.btn-line { background:var(--experience-line); }
.btn-xl { font-size:17px; padding:18px 26px; }
.skip-link { position:fixed; top:8px; left:8px; z-index:200; padding:12px 20px; background:var(--experience-surface); color:var(--experience-accent); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.site-tabs { height:var(--site-bar-height); display:flex; justify-content:space-between; gap:0; width:100%; background:var(--experience-dark); color:var(--experience-light); box-shadow:none; border:0; }
.site-tabs .st-tab { font-size:12px; color:var(--experience-light); padding:0 20px; }
.site-tabs .st-tab.active { color:var(--experience-amber); border-color:var(--experience-amber); }
.site-tabs .st-tab:hover { color:var(--experience-amber); }
@media(max-width:859px) {
  :root { --site-bar-height:46px; }
  .site-tabs { position:sticky; top:0; z-index:70; height:46px; display:flex; overflow-x:auto; justify-content:flex-start; width:100%; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 2px 10px rgba(0,0,0,.05); scrollbar-width:none; }
  .site-tabs::-webkit-scrollbar { display:none; }
  .site-tabs .st-tab { flex:0 0 auto; display:flex; align-items:center; height:100%; padding:0 16px; font-size:13px; font-weight:800; color:var(--sub); text-decoration:none; white-space:nowrap; border-bottom:3px solid transparent; }
  .site-tabs .st-tab.active { color:var(--green-d); border-bottom-color:var(--green); }
  .site-tabs .st-tab:hover { color:var(--green-d); }
}
header,header.solid { position:sticky; top:var(--site-bar-height); background:var(--experience-glass); backdrop-filter:blur(16px); border-bottom:1px solid var(--experience-rule); }
.bar { min-height:76px; max-width:1240px; padding:12px 32px; gap:20px; }
.bar .brand { flex-shrink:0; }
.bar>nav { margin-left:auto; gap:16px; }
.bar>nav .nl { display:none; }
.bar>.right { margin-left:auto; }
.bar .btn { min-height:44px; }
.site-menu { position:relative; flex-shrink:0; }
.site-menu summary { display:flex; align-items:center; justify-content:center; gap:10px; cursor:pointer; list-style:none; border:1px solid var(--experience-rule); border-radius:8px; padding:10px 15px; min-height:46px; font-size:13px; font-weight:700; color:var(--experience-accent); }
.site-menu summary::-webkit-details-marker { display:none; }
.site-menu summary::after { content:'＋'; font-size:19px; line-height:1; }
.site-menu[open] summary::after { content:'−'; }
.menu-panel { position:absolute; right:0; top:calc(100% + 16px); width:min(350px,calc(100vw - 32px)); max-height:calc(100dvh - 130px); overflow:auto; padding:20px; border:1px solid var(--experience-rule); border-radius:14px; box-shadow:var(--experience-shadow); background:var(--experience-surface); }
.menu-panel nav { display:grid; gap:0; }
.menu-panel nav a { padding:12px 4px; min-height:46px; color:var(--ink); font-size:15px; border-bottom:1px solid var(--experience-rule); }
.menu-panel nav a::after { content:'↗'; float:right; color:var(--experience-accent); }
.menu-settings { display:none; gap:8px; margin-top:20px; }
.menu-settings .settings-label { font-size:12px; color:var(--sub); }
.menu-settings button { position:static; border:1px solid var(--experience-rule); background:var(--experience-soft); color:var(--experience-accent); border-radius:6px; font:700 14px var(--jp-sans); padding:12px; min-height:46px; cursor:pointer; box-shadow:none; }
.menu-settings button[aria-pressed="true"] { background:var(--experience-accent); color:var(--experience-surface); }
html.a11y-large { zoom:1; }
html.a11y-large body { font-size:20px; }
html.a11y-large :is(p,.lead,.tagline,.cbody,.step p,.card p,.vcard p,.uc p,.svc .body p,.ceo p,.ctable th,.ctable td,.form label,.equip .it span) { font-size:20px; }
html.a11y-large .form :is(input,select,textarea) { font-size:20px; }
.hero { min-height:650px; min-height:min(800px,calc(100svh - 120px)); perspective:none; }
.hero .photo { animation:none; inset:-8% 0; transform:translate3d(0,var(--hero-shift,0px),0) scale(1.04); }
.hero .overlay { background:linear-gradient(90deg,var(--experience-surface) 0%,var(--experience-glass) 26%,var(--experience-fade-middle) 52%,var(--experience-fade-edge) 80%); }
.hero .inner { width:100%; max-width:1200px; padding:70px 32px 85px; will-change:auto; }
.hero h1 { font-size:clamp(34px,4.1vw,60px); line-height:1.65; letter-spacing:.035em; margin-top:24px; }
.hero .sub { max-width:580px; background:var(--experience-glass); box-shadow:none; border-left:2px solid var(--amber); border-radius:0; padding:12px 18px; font-size:16px; }
.hero .latin { margin-top:24px; font-size:11px; }
.hero .kicker { font-size:12px; border-radius:5px; box-shadow:none; padding:6px 12px; }
.hero .kicker+.kicker { background:var(--experience-green)!important; margin:8px 0 0 8px!important; }
.hero .ghost { opacity:.08; transform:translateY(-50%) rotate(12deg); }
.hero .routes { transform:translate3d(0,var(--route-shift,0px),0); }
.hero .routes .fl { animation:none; }
.hero .routes path.fl { stroke-dasharray:1600; stroke-dashoffset:var(--route-dash,1200); }
.hero-caption { position:absolute; right:40px; bottom:48px; z-index:4; color:var(--experience-surface); text-align:right; padding:12px 16px; border-right:2px solid var(--experience-amber); background:var(--experience-caption); backdrop-filter:blur(10px); font-size:13px; }
.hero-caption span { display:block; font:700 10px var(--latin); letter-spacing:.18em; margin-bottom:6px; }
.scrolldown { display:none; }
body[data-site="company"] .hero { padding:0; }
body[data-site="madoka"] .hero { display:flex; align-items:center; padding:56px 0 68px; }
body[data-site="madoka"] .hero>.wrap { width:100%; max-width:1200px; padding:0 32px; }
body[data-site="madoka"] .hero h1 { font-size:clamp(32px,3.7vw,52px); }
body[data-site="madoka"] .tagline { max-width:600px; font-size:16px; border-left:2px solid var(--amber); border-radius:0; box-shadow:none; background:var(--experience-glass); }
.badges { gap:8px; max-width:630px; margin-bottom:20px; }
.badge { font-size:12px; padding:5px 10px; box-shadow:none; border-radius:5px; }
.hero .cta-row { max-width:640px; gap:10px; }
.hero .cta-row .btn { font-size:15px; padding:14px 20px; }
.chapter-nav { display:flex; align-items:center; position:sticky; top:calc(var(--site-bar-height) + var(--header-height)); z-index:45; background:var(--experience-glass); border-block:1px solid var(--experience-rule); backdrop-filter:blur(16px); padding:0 max(24px,calc((100vw - 1136px)/2)); gap:24px; min-height:56px; }
.chapter-title { color:var(--sub); font-size:11px; letter-spacing:.08em; white-space:nowrap; }
.chapter-links { display:flex; overflow:auto; scrollbar-width:none; flex:1; gap:26px; scroll-snap-type:x proximity; }
.chapter-links::-webkit-scrollbar { display:none; }
.chapter-links a { flex:none; position:relative; padding:16px 0; font-size:13px; font-weight:700; color:var(--sub); white-space:nowrap; scroll-snap-align:start; }
.chapter-links a::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:var(--experience-accent); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.chapter-links a[aria-current="location"] { color:var(--experience-accent); }
.chapter-links a[aria-current="location"]::after,.chapter-links a:hover::after { transform:scaleX(1); }
.read-progress { position:absolute; bottom:-2px; left:0; height:2px; width:100%; background:var(--amber); transform:scaleX(var(--read-progress,0)); transform-origin:left; pointer-events:none; }
.quick-paths { padding:32px 0 36px; background:var(--experience-surface); border-bottom:1px solid var(--experience-rule); }
.quick-paths>.wrap { max-width:1200px; }
.quick-label { font-size:12px; color:var(--sub); margin-bottom:16px; }
.quick-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
.quick-link { display:grid; grid-template-columns:1fr auto; padding:10px 24px; border-left:1px solid var(--experience-rule); min-width:0; transition:background .2s; }
.quick-link:first-child { border-left:0; padding-left:0; }
.quick-link span { color:var(--experience-accent); font-size:11px; letter-spacing:.07em; }
.quick-link strong { font-size:19px; grid-row:2; }
.quick-link .arrow { grid-column:2; grid-row:1/3; align-self:center; font-size:23px; transition:transform .2s; }
.quick-link:hover { background:var(--experience-soft); }
.quick-link:hover .arrow { transform:translate(3px,-3px); }
.sec-head .en { font-size:11px; letter-spacing:.2em; }
.sec-head h2 { font-size:clamp(27px,3vw,36px); line-height:1.6; }
.sec-head::after { content:''; display:block; width:38px; height:2px; background:var(--amber); margin:20px 0 0; }
body[data-site="madoka"] .sec-head::after,.sec-head.center::after { margin-inline:auto; }
.origin { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); }
.values { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-block:1px solid var(--experience-rule); }
.vcard { box-shadow:none; border:0; border-radius:0; border-left:1px solid var(--experience-rule); background:none; padding:36px 28px; }
.vcard:first-child { border-left:0; }
.vcard .n { font-size:36px; color:var(--experience-accent); letter-spacing:-.04em; }
.vcard:hover { box-shadow:none; transform:none; }
.vcard p { font-size:16px; }
.svc { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); border-radius:12px; box-shadow:none; }
.svc .vis .photo { animation:none; }
.svc .vis { min-height:380px; }
.svc .body { padding:40px; }
.svc .body p { font-size:16px; }
.svc .vis .t b { font-size:22px; }
.ceo .panel { max-width:860px; margin:auto; box-shadow:none; border-radius:12px; }
.ceo blockquote { font-size:clamp(21px,2.4vw,28px); }
.ceo p { font-size:16px; }
.ctable { max-width:860px; }
body[data-site="company"] footer nav { flex-wrap:wrap; }
body[data-site="company"] footer nav a { white-space:nowrap; }
.rv,.rv.on { opacity:1; transform:none; }
.motion-enabled .rv.is-waiting { opacity:0; transform:translateY(18px); }
.rv { transition:opacity var(--experience-reveal) var(--experience-ease),transform var(--experience-reveal) var(--experience-ease); }
.hero .rv { opacity:1; transform:none; }
body[data-site="madoka"] .g3.grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
body[data-site="madoka"] .g3.grid .card { background:none; border:0; border-left:1px solid var(--experience-veil); border-radius:0; box-shadow:none; transform:none; padding:28px; }
body[data-site="madoka"] .g3.grid .card:first-child { border-left:0; }
body[data-site="madoka"] .g3.grid .card p { font-size:16px; }
body[data-site="madoka"] section#usecases,body[data-site="madoka"] section#equipment,body[data-site="madoka"] section#flow { padding-top:80px!important; }
.usecase-list { max-width:none; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 40px; }
.usecase-list .uc:nth-child(n) { margin:0; min-width:0; padding:30px 0; }
.usecase-list .uc h3 { font-size:19px; }
.usecase-list .uc p { font-size:16px; }
.carousel-controls { display:none; justify-content:flex-end; align-items:center; gap:14px; margin-top:20px; }
.carousel-controls button { width:46px; height:46px; border:1px solid var(--experience-accent); border-radius:50%; background:var(--experience-surface); color:var(--experience-accent); font-size:20px; cursor:pointer; }
.carousel-controls button:disabled { opacity:.35; cursor:default; }
.carousel-status { font:700 13px var(--latin); color:var(--experience-accent); }
.equip { grid-template-columns:repeat(2,minmax(0,1fr)); }
.flow-price .fp-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.step .n { transition:background .35s,box-shadow .35s; background:var(--experience-soft); color:var(--experience-accent); box-shadow:0 0 0 6px var(--paper); }
.step.is-current .n { background:var(--experience-accent); color:var(--experience-surface); box-shadow:0 0 0 6px var(--experience-soft); }
.step.is-current h3 { color:var(--experience-accent); }
.form { border-radius:12px; box-shadow:none; }
.form-progress { display:none; justify-content:space-between; gap:12px; font-size:13px; color:var(--experience-accent); background:var(--experience-soft); padding:12px 14px; margin-bottom:24px; border-radius:6px; }
.form-progress span:last-child { font-weight:700; white-space:nowrap; }
.form :is(input,select,textarea) { scroll-margin-bottom:140px; }
.form input[aria-invalid="true"] { border-color:var(--experience-gold); }
.infoband .ib { min-width:0; }
.success-message { padding:20px; margin:0 0 24px; background:var(--experience-soft); color:var(--experience-accent); border-left:4px solid var(--experience-accent); }
.back-top { display:inline-flex; align-items:center; gap:10px; margin-top:28px; padding:10px 16px; border:1px solid currentColor; border-radius:6px; min-height:46px; text-decoration:none; font-size:13px; }
@media(min-width:1500px) { .hero { min-height:760px; } }
@media(max-width:1000px) {
  .hero-caption { display:none; }
  .hero h1 { font-size:42px; }
  .bar .home { display:none; }
  .site-tabs .st-tab { padding-inline:16px; }
  .svc .body { padding:30px; }
}
@media(max-width:860px) {
  :root { --site-bar-height:0px; --header-height:72px; }
  .bar { min-height:72px; padding:12px 20px; gap:12px; }
  .bar>.right,.bar>nav { display:none; }
  .site-menu { margin-left:auto; }
  .hero { min-height:auto; }
  .hero .inner { padding:56px 24px 64px; }
  .hero h1 { font-size:clamp(30px,5vw,42px); }
  .hero .overlay { background:linear-gradient(100deg,var(--experience-glass),var(--experience-mobile-middle) 60%,var(--experience-mobile-edge)); }
  .hero .photo { background-position:65% center; }
  .hero .kicker+.kicker { margin-left:0!important; display:table; }
  .hero .sub { font-size:16px; }
  .hero .ghost { right:-120px; }
  .chapter-nav { padding-inline:22px; gap:12px; }
  .chapter-title { display:none; }
  .chapter-links { gap:22px; }
  .quick-link { padding-inline:18px; }
  .quick-link strong { font-size:16px; }
  .quick-link span { font-size:10px; }
  .origin { grid-template-columns:minmax(0,1fr); }
  .origin .markbox { padding:16px; }
  .origin .markbox .big { max-width:180px; }
  .values { grid-template-columns:minmax(0,1fr); }
  .vcard { border-left:0; border-bottom:1px solid var(--experience-rule); padding:26px 0 26px 66px; position:relative; }
  .vcard:last-child { border-bottom:0; }
  .vcard .n { position:absolute; left:0; top:27px; font-size:30px; }
  .vcard h3 { margin-top:0; }
  .svc { grid-template-columns:minmax(0,1fr); }
  .svc .vis { min-height:240px; }
  .svc .body { padding:32px; }
  body[data-site="madoka"] .hero>.wrap { padding-inline:24px; }
  body[data-site="madoka"] .hero h1 { font-size:clamp(29px,4.8vw,42px); }
  body[data-site="madoka"] .g3.grid { grid-template-columns:minmax(0,1fr); }
  body[data-site="madoka"] .g3.grid .card { border-left:0; border-bottom:1px solid var(--experience-veil); padding:28px 0; }
  body[data-site="madoka"] .g3.grid .card:last-child { border-bottom:0; }
  body[data-site="madoka"] .g3.grid .card .ic { float:left; margin-right:20px; }
  .flow-price .fp-grid { grid-template-columns:minmax(0,1fr); gap:40px; }
  .flow-price .fp-grid::before { display:none; }
  .fp-price { border-top:1px solid var(--experience-rule); padding-top:34px; }
}
@media(max-width:600px) {
  .wrap { padding-inline:20px; }
  .bar { padding-inline:16px; }
  .bar .brand { gap:8px; flex-shrink:1; min-width:0; }
  .bar .brand .mk { width:30px; height:30px; }
  .bar .brand .jp { font-size:14px; letter-spacing:0; white-space:nowrap; }
  .bar .brand .lt { font-size:9px; }
  .bar .brand .by { font-size:9px; letter-spacing:0; }
  .site-menu summary { font-size:12px; padding:8px 10px; gap:5px; }
  .hero .inner { padding:44px 20px 48px; }
  .hero h1 { font-size:clamp(28px,7.3vw,42px); line-height:1.75; }
  .hero .sub,.tagline { font-size:15px; }
  .hero .latin { margin-top:20px; }
  .hero .cta { flex-direction:column; gap:10px; }
  .hero .cta .btn { width:100%; font-size:15px; padding-inline:16px; }
  .hero .kicker { font-size:11px; padding:6px 8px; }
  .quick-paths { padding:24px 0; }
  .quick-grid { grid-template-columns:minmax(0,1fr); }
  .quick-link,.quick-link:first-child { border-left:0; border-bottom:1px solid var(--experience-rule); padding:14px 0; }
  .quick-link:last-child { border-bottom:0; }
  .quick-link strong { font-size:19px; }
  .quick-link span { font-size:11px; }
  .chapter-links a { font-size:12px; }
  .chapter-nav { padding-inline:20px; }
  section { padding-block:60px; }
  .sec-head { margin-bottom:30px; }
  .sec-head h2 { font-size:26px; }
  .concept .cph { font-size:28px; letter-spacing:.04em; }
  .concept .cbody { font-size:16px; line-height:2.1; }
  .xr { font-size:22px; letter-spacing:.04em; }
  .svc .body,.ceo .panel { padding:26px 20px; }
  .svc .body h3 { font-size:24px; }
  .svc .vis { padding:30px 20px; }
  .svc .body .btn { width:100%; font-size:15px; padding-inline:12px; }
  .ceo blockquote { font-size:21px; padding-left:14px; }
  .ctable th { width:95px; font-size:13px; padding:18px 8px 18px 0; }
  .ctable td { font-size:14px; padding:18px 0 18px 8px; overflow-wrap:anywhere; }
  .contact .cta { flex-direction:column; }
  .contact .cta .btn { font-size:15px; padding-inline:12px; }
  body[data-site="madoka"] .hero { padding:36px 0 44px!important; }
  body[data-site="madoka"] .hero>.wrap { padding-inline:20px; }
  body[data-site="madoka"] .hero h1 { font-size:clamp(26px,6.6vw,36px); line-height:1.75; }
  .badges { gap:6px; margin-bottom:18px; }
  .badge { font-size:11px; padding:4px 8px; }
  .hero .cta-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .hero .cta-row .btn { font-size:13px; padding:13px 8px; }
  .hero .cta-row .btn:first-child { grid-column:1/-1; font-size:16px; }
  .hero .cta-row .btn-status { grid-column:1/-1; }
  .usecase-list { display:grid; grid-auto-flow:column; grid-template-columns:none; grid-auto-columns:88%; gap:18px; overflow-x:auto; scroll-snap-type:x proximity; padding:4px 0 14px; scrollbar-width:thin; }
  .usecase-list .uc:nth-child(n) { scroll-snap-align:start; display:block; border:1px solid var(--experience-rule); border-radius:10px; padding:24px; background:var(--experience-surface); }
  .usecase-list .uc .ic { margin-bottom:18px; }
  .usecase-list .rv { opacity:1; transform:none; transition:none; }
  .carousel-controls.is-ready { display:flex; }
  .equip { grid-template-columns:minmax(0,1fr); }
  .equip .it:nth-child(odd) { border-right:0; }
  .equip .it { padding-inline:0; }
  .form { padding:26px 18px; }
  .form .submit { font-size:16px; padding-inline:10px; }
  #form .sec-head .btn { font-size:12px; padding-inline:10px; }
  .form-progress { font-size:12px; padding:10px; }
  .contact .panel { padding:26px 18px; }
  .contact .panel .btn { font-size:14px; width:100%; padding-inline:10px; }
  .infoband .ib { padding-inline:8px; }
  .infoband .ib .v { font-size:15px; }
  .infoband .ib .l { font-size:11px; }
  .sticky { gap:8px; padding-inline:12px; }
  .sticky .btn { font-size:14px; }
  .sticky .btn-tel { font-size:13px; }
  footer a { font-size:12px; }
  body[data-site="madoka"] footer p>a { display:inline; }
  html.a11y-large .ctable th { width:100px; font-size:16px; white-space:normal; }
  html.a11y-large .ctable td { font-size:18px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
  .hero .photo,.hero .routes,.hero .wm { transform:none!important; }
  .rv,.motion-enabled .rv.is-waiting { opacity:1; transform:none; }
  .usecase-list,.chapter-links { scroll-snap-type:none; }
}
html.motion-off { scroll-behavior:auto; }
.motion-off *,.motion-off *::before,.motion-off *::after { animation:none!important; transition:none!important; }
.motion-off .hero .photo,.motion-off .hero .routes,.motion-off .hero .wm { transform:none!important; }
.motion-off .rv { opacity:1!important; transform:none!important; }
.motion-off .usecase-list,.motion-off .chapter-links { scroll-snap-type:none; }
@media print {
  .site-tabs,header,.chapter-nav,.sticky,.carousel-controls,.back-top { display:none!important; }
  .rv,.motion-enabled .rv.is-waiting { opacity:1!important; transform:none!important; }
  .usecase-list { display:block; overflow:visible; }
  .hero { min-height:0; }
}

.experience-ready .menu-settings { display:grid; }
.experience-ready .form-progress { display:flex; }
main p a:not(.btn),.ctable td a { text-decoration:underline; text-underline-offset:3px; }

/* 2026-09-23 refinement: restore the moving opening and tell each service's story. */
body[data-site="company"] .hero .photo { animation:routeLandscape 24s ease-in-out infinite alternate; }
body[data-site="company"] .hero .routes .fl { stroke-dasharray:14 106; stroke-dashoffset:0; animation:flow 9s linear infinite; }
body[data-site="company"] .hero .routes .fl2 { animation-delay:-4.5s; }
body[data-site="company"] .hero .ghost { animation:routeMark 12s ease-in-out infinite alternate; }
body[data-site="company"] .hero h1 { animation:openingReveal 1s var(--experience-ease) both; }
body[data-site="company"] .hero .sub { animation:openingReveal 1s .16s var(--experience-ease) both; }
@keyframes routeLandscape {
  from { transform:translate3d(0,var(--hero-shift,0px),0) scale(1.03); }
  to { transform:translate3d(-1.2%,calc(var(--hero-shift,0px) - 1%),0) scale(1.14); }
}
@keyframes routeMark {
  from { transform:translateY(-50%) perspective(900px) rotateY(var(--ghost-turn,12deg)) rotateZ(-5deg); }
  to { transform:translateY(-54%) perspective(900px) rotateY(calc(var(--ghost-turn,12deg) + 14deg)) rotateZ(5deg); }
}
@keyframes openingReveal { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
.service>.wrap { max-width:1200px; }
.service-intro { color:var(--sub); font-size:18px; line-height:2; margin:-12px 0 64px; max-width:760px; }
.service-story { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:start; gap:52px; padding:0 0 76px; border-bottom:1px solid var(--experience-rule); }
.service-story+.service-story { margin-top:76px; }
.service-story:last-child { padding-bottom:0; border-bottom:0; }
.service-picture { min-width:0; position:sticky; top:calc(var(--site-bar-height) + var(--header-height) + var(--chapter-height) + 30px); }
.service-picture img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:12px; box-shadow:var(--experience-shadow); }
.service-picture figcaption { font-size:11px; color:var(--sub); margin-top:10px; text-align:right; }
.service-scenes { display:flex; flex-wrap:wrap; gap:10px 16px; margin-top:24px; padding-top:20px; border-top:1px solid var(--experience-rule); }
.service-scenes span { font-size:13px; color:var(--experience-accent); }
.service-scenes span::before { content:'／'; color:var(--amber); margin-right:6px; }
.service-copy { min-width:0; }
.service-kicker { display:flex; align-items:center; gap:14px; color:var(--experience-accent); font-size:12px; font-weight:700; letter-spacing:.06em; margin-bottom:16px; }
.service-kicker span { font:500 34px var(--latin); letter-spacing:-.05em; color:var(--experience-gold); }
.service-copy h3 { font-size:23px; font-family:var(--jp-sans); color:var(--ink); letter-spacing:.01em; }
.service-promise { font:700 clamp(26px,2.45vw,35px)/1.7 var(--jp-serif); letter-spacing:.02em; margin:22px 0; color:var(--experience-accent); }
.service-copy>p:not(.service-promise):not(.service-kicker) { font-size:16px; color:var(--sub); line-height:2; }
.service-details { margin:28px 0; }
.service-details>div { padding:18px 0; border-bottom:1px solid var(--experience-rule); }
.service-details dt { font-size:16px; font-weight:700; margin-bottom:6px; }
.service-details dd { font-size:14px; line-height:1.85; color:var(--sub); }
.service-actions { display:flex; align-items:center; flex-wrap:wrap; gap:16px 22px; }
.service-actions .btn { font-size:15px; padding:15px 22px; }
.service-text-link { font-weight:700; font-size:14px; text-decoration:underline; text-underline-offset:5px; min-height:44px; display:inline-flex; align-items:center; }
.service-taxi { --experience-accent:var(--experience-green); }
.service-taxi .btn-brand { background:var(--experience-green); }
.service-facility .service-picture { order:2; }
.service-facility .service-copy { order:1; }
.service-map { margin-top:24px; border-radius:12px; overflow:hidden; border:1px solid var(--experience-rule); background:var(--experience-soft); }
.service-map iframe { width:100%; height:440px; display:block; }
.map-link { margin-top:16px; }
.map-link a { display:inline-flex; align-items:center; min-height:44px; font-weight:700; color:var(--experience-accent); }
.form-note-example { font-size:13px; color:var(--sub); line-height:1.8; margin-top:10px; }
@media(max-width:1000px) { .service-story { gap:32px; } .service-copy h3 { font-size:21px; } .service-promise { font-size:28px; } }
@media(max-width:760px) {
  .service-intro { font-size:16px; margin-bottom:38px; }
  .service-intro br { display:none; }
  .service-story { grid-template-columns:minmax(0,1fr); gap:28px; padding-bottom:48px; }
  .service-story+.service-story { margin-top:48px; }
  .service-picture { position:relative; top:auto; }
  .service-facility .service-picture,.service-facility .service-copy { order:initial; }
  .service-scenes { margin-top:16px; padding-top:16px; gap:8px 12px; }
  .service-scenes span { font-size:12px; }
  .service-copy h3 { font-size:23px; }
  .service-promise { font-size:28px; }
  .service-actions { gap:12px; }
  .service-actions .btn { width:100%; }
  .service-map iframe { height:440px; }
}
@media(prefers-reduced-motion:reduce) {
  body[data-site="company"] .hero :is(.photo,.ghost,h1,.sub),body[data-site="company"] .hero .routes .fl { animation:none!important; }
}
.motion-off body[data-site="company"] .hero :is(.photo,.ghost,h1,.sub),.motion-off body[data-site="company"] .hero .routes .fl { animation:none!important; }
