/* OCEAN Brand & Creative Guidelines 1.0: existing structure, new UI standard. */
:root{--navy:#14213D;--dark:#14213D;--paper:#FFFFFF;--ink:#14213D;--muted:#526477;--line:#CBD5DF;--ice:#EAF0F4;--teal:#193D58;--serif:"Noto Serif JP","Yu Mincho",serif;--sans:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;--brand-surface:#F6F8FA;--brand-border:#708496;--brand-hover:#102D44;--brand-active:#0B2235;--brand-wine:#914F60;--brand-purple:#60516E;--brand-header:80px}
html{scroll-padding-top:calc(var(--brand-header) + 24px)}
body{background:#FFFFFF;font-family:var(--sans);font-size:16px;line-height:1.8}
::selection{background:#EAF0F4;color:#14213D}
.shell{width:min(1200px,calc(100% - 96px))}
main section{scroll-margin-top:calc(var(--brand-header) + 24px)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;letter-spacing:0;line-height:1.45}
body main h1,.hero h1,.detail-hero h1,.rep-hero h1,.privacy-main h1{font-size:56px;line-height:1.35;font-weight:500;letter-spacing:0}
body main h2,.detail-section h2,.rep-section h2,.detail-contact h2,.rep-contact h2,.story-section-heading h2,.current-advisory h2,.business-background h2{font-size:40px;line-height:1.45;font-weight:500}
body main h3,.detail-offers h3,.service-name h3,.choice-row h3,.workflow-line h3{font-size:28px;line-height:1.45;font-weight:500}
body main h4{font-size:20px;line-height:1.5}
.section{padding-block:112px}.detail-section,.rep-section{padding-block:80px;gap:64px}
.detail-section-body{min-width:0}.detail-section-body>p,.rep-prose>p{max-width:720px}
.hero-description,.service-copy>p,.service-copy ul,.intro,.intro p,.rep-prose p,.rep-note,.detail-issues,.detail-section-body p,.reading-body p,.longform-prose p,.qa-answers p,.company-details,.company-details dt,.detail-company dt,.profile>div,.usecase-top>p,.case-node>p,.human-note p,.process-flow li>p:not(.eyebrow),.deliverable,.metrics>div>p:last-child,.philosophy-inner>p:not(.eyebrow),.recommendation>p:not(.eyebrow),.recommendation .recommend-question,.representative-copy p,.mvv p,.faq-answer>div,.faq-list details>p,.contact-intro p,.contact-note,.form-note{font-size:16px!important;line-height:1.8}
.hero-lead,.story-index-intro{font-size:20px;line-height:1.8}
.detail-lead,.story-hero .detail-lead,.rep-statement{font-size:28px;line-height:1.65}
.eyebrow,.caption,.diagram-caption,.diagram-index,.section-meta>span,.metric-label,.service-name .eyebrow,.case-node .diagram-index,.process-flow .eyebrow,.privacy-date,.rep-english,.detail-note,.advisory-note,.choice-category,.brand-hero-logo figcaption{font-size:14px;line-height:1.5;color:var(--muted)}
.detail-number,.service-no,.workflow-number,.step-number{font-family:Georgia,serif}
.rep-role{font-size:16px}.rep-name{font-size:18px}
.site-header{height:80px;padding-inline:max(48px,calc((100% - 1200px)/2));background:#FFFFFF;border-bottom:1px solid var(--line);backdrop-filter:none;gap:24px}
.site-header .brand{display:flex;align-items:center;justify-content:center;width:128px;min-height:64px;padding:10px 12px;flex-shrink:0}
.header-brand-symbol{width:104px;height:auto;object-fit:contain}
.site-header nav{display:flex;align-items:center;gap:24px;font-size:16px;font-weight:500}
.site-header nav>a{min-height:48px;display:flex;padding:8px 0;line-height:1.5}
.site-header nav a:not(.nav-action):after{bottom:2px;background:var(--teal);transition:right 160ms}
.site-header nav a[aria-current]:after{right:0}
.site-header .nav-action{background:var(--teal);color:#FFFFFF;border:1px solid var(--teal);border-radius:4px;padding:12px 24px;gap:16px;min-height:48px;font-size:16px}
.site-header .nav-action:hover{background:var(--brand-hover)}
.site-header .menu-toggle{display:none}.mobile-site-navigation{display:none}
.button,.text-link,.story-link,.summary-detail-link,.service-detail-link,.home-route,.choice-row{transition:color 160ms,background-color 160ms,border-color 160ms;transform:none}
.button{border-radius:4px;padding:12px 24px;min-height:48px;font-size:16px;font-weight:500;line-height:1.5;gap:24px}
.button:hover{transform:none}
.button-dark{background:var(--teal);color:#FFFFFF}.button-dark:hover{background:var(--brand-hover)}.button-dark:active{background:var(--brand-active)}
.hero-actions .button{padding:12px 24px;font-size:16px;min-height:64px;border-color:var(--teal)}
.hero-actions .hero-secondary{background:#FFFFFF;color:var(--teal)}.hero-actions .hero-secondary:hover{background:var(--ice)}
.hero-actions .button-label{font-size:16px}.hero-actions .button-label>span{white-space:normal}
.hero-actions .button span[aria-hidden]{font-size:20px}
.text-link,.story-link,.summary-detail-link,.service-copy .service-detail-link,.footer-sitemap-group a,.page-toc a,.story-shortcuts a,.detail-breadcrumb a,.rep-breadcrumb a{min-height:48px;font-size:16px;line-height:1.8;text-underline-offset:5px}
.hero{height:calc(100svh - 80px);min-height:650px;max-height:900px;background:var(--brand-surface)}
.hero-content{padding-block:64px 88px}.hero h1{margin-bottom:24px}.hero-description{max-width:480px}
.hero .eyebrow{font-size:14px;line-height:1.5}.hero-bottom{font-size:14px}.hero-bottom>span{font-size:14px;letter-spacing:.06em}
.hero:after{background:linear-gradient(90deg,rgba(246,248,250,.97),rgba(246,248,250,.76) 40%,rgba(246,248,250,.08) 78%)}
.services,.company,.contact-section{background:var(--brand-surface)}
.home-routes{padding-block:48px}.home-routes h2{font-size:28px}.home-route{font-size:20px}
.section-meta{margin-bottom:48px}.split-heading{gap:64px;margin-bottom:48px}.intro{max-width:520px}
.bridge{padding-inline:0;grid-template-columns:1fr 40px 1.3fr 40px 1fr;gap:0}
.bridge-core{background:#EAF0F4;box-shadow:none;border-color:#708496}.bridge-core:before{border-color:#CBD5DF}
.bridge-core h3{font-size:24px}.bridge-core p,.bridge-end p,.core-tags{font-size:16px}.bridge-end h3{font-size:24px}
.core-overline{color:var(--teal);font-family:Georgia,serif}
.service-row{border-color:var(--line);gap:32px;padding-block:48px}.service-no{color:var(--muted)}
.service-copy ul{padding-left:20px}.service-copy li+li{margin-top:4px}
.usecase-tabs button{font-size:16px;min-height:72px;padding:16px;gap:12px;border-radius:4px 4px 0 0}
.usecase-tabs button span{font-size:18px}.usecase-tabs button[aria-selected=true]{background:var(--ice);color:var(--teal);border-color:var(--teal)}
.usecase-panel{background:var(--brand-surface);padding:40px 32px}.usecase-top h3{font-size:28px;line-height:1.5}
.case-flow{gap:0;margin-block:40px}.case-node h4{font-family:var(--sans);font-size:18px;line-height:1.6}
.human-note{gap:24px}.human-note>span{font-size:16px;white-space:normal;min-width:130px}
.dark-section{background:var(--navy);color:#FFFFFF}.dark-section h2,.dark-section h3{color:#FFFFFF}
.dark-section .eyebrow,.dark-section .intro,.dark-section .section-meta>span,.dark-section .process-flow li>p:not(.eyebrow),.dark-section .iteration-line{color:#EAF0F4}
.process-flow{gap:32px}.process-flow h3{font-size:24px}.process-flow li>p:not(.eyebrow){min-height:0}.step-number{color:#FFFFFF}
.iteration-line{font-size:16px;flex-wrap:wrap}.iteration-line>span:last-child{font-size:14px}
.metrics h3{font-size:24px}.metrics>div{padding-inline:24px}.metrics .metric-value{font-size:72px}.metric-value span{font-size:16px}
.philosophy{padding-block:112px}.philosophy h2{font-size:36px;line-height:1.8}.philosophy:after{background:linear-gradient(90deg,rgba(246,248,250,.97),rgba(246,248,250,.91) 65%,rgba(246,248,250,.72))}
.philosophy-sign{color:var(--teal)}
.recommendation{background:var(--ice);padding:32px;border-top-color:var(--teal);border-radius:8px}.recommendation h3{font-size:28px}.recommend-flow{font-size:16px;flex-wrap:wrap;gap:12px}
.challenge{font-size:16px;min-height:64px;padding-block:20px}.challenge>span{font-size:16px}
.company-grid{gap:64px}.company-message{font-size:24px}.company-details>div{gap:24px}
.detail-company>div{gap:24px}.detail-section h2{margin-top:16px}.detail-section-body p+p,.rep-prose p+p{margin-top:24px}
.detail-focus{padding:48px;background:var(--ice);border-radius:8px}.detail-focus h2{font-size:32px}.detail-focus .detail-philosophy{font-size:28px!important;line-height:1.9}
.detail-contact,.rep-contact{padding-block:80px;background:var(--brand-surface)}
.detail-contact .button,.rep-contact .button{font-size:16px;min-height:48px}
.story-mid-cta{background:var(--navy);color:#FFFFFF;border-radius:8px;padding:32px;gap:32px}
.story-mid-cta h2{font-size:28px;color:#FFFFFF}.story-mid-cta p{color:#EAF0F4}
.story-mid-cta .button{background:#FFFFFF;color:var(--navy);font-size:16px;border:1px solid #FFFFFF;min-height:48px}
.story-mid-cta .button:hover{background:#EAF0F4}
.story-shortcuts{padding-block:16px;gap:8px 24px}.story-shortcuts a{font-size:16px}
.reading-item>summary,.faq-answer>summary,.detail-faq summary,.profile summary{font-size:18px;min-height:48px;line-height:1.6;padding-block:24px}
.reading-body h3,.qa-answers h3,.longform-prose h3{font-size:24px;line-height:1.5}
.reading-body p,.reading-body li{font-size:16px;line-height:1.8}
.workflow-line{gap:40px}.workflow-line h3{font-size:24px}.workflow-note{font-size:14px}.workflow-return{font-size:16px}
.change-row p{font-size:18px;line-height:1.8}.change-labels{font-size:16px}
.faq-tools{background:var(--brand-surface);padding:32px;border-radius:8px;gap:24px}
.faq-tools label,.form-field label,.consent-field{font-size:16px;line-height:1.8}
.form-field input,.form-field textarea,.faq-tools input,.faq-tools select{font-family:var(--sans);font-size:16px!important;line-height:1.8;min-height:48px;padding:12px 16px;border:1px solid var(--brand-border);border-radius:4px;background:#FFFFFF;color:var(--navy);box-sizing:border-box;width:100%;box-shadow:none;-webkit-appearance:none}
.faq-tools select{appearance:auto}.form-field textarea{min-height:160px;resize:vertical}
.form-field input::placeholder,.form-field textarea::placeholder{color:var(--muted);opacity:1}
.form-field label span{font-size:14px}.form-field input[aria-invalid=true],.form-field textarea[aria-invalid=true]{border-color:#A12F43}
.consent-field input{accent-color:var(--teal);width:20px;height:20px;flex-shrink:0}
.contact-data-note,.contact-consent,.form-status,.form-error{font-size:14px;line-height:1.8}
.form-status{margin-top:16px;color:var(--muted)}.form-status[data-state=error]{color:#A12F43;font-size:16px}
button:disabled{opacity:1;background:#EAF0F4;color:#526477;cursor:wait}
.privacy-main{width:min(816px,calc(100% - 96px));max-width:816px;padding:48px 0 80px}
.privacy-main h2{font-size:28px;line-height:1.5;font-family:var(--serif)}.privacy-main h3{font-size:24px}
.privacy-main section{padding-block:40px}.privacy-date{font-size:14px}
.site-footer{padding-block:64px 32px;background:#FFFFFF}.footer-brand{display:inline-block;width:180px;margin:0 0 24px;line-height:0}
.footer-brand img{display:block;width:100%;height:auto}.site-footer>div>p{font-size:16px;line-height:1.8}
.footer-sitemap{gap:32px!important;padding-block:32px;margin-top:32px}.footer-sitemap-group h3{font-family:var(--sans);font-size:16px;font-weight:500;margin-bottom:8px;color:var(--muted)}
.footer-sitemap-group a{font-size:16px;min-height:48px;padding-block:9px}.footer-bottom,.footer-bottom small{font-size:14px}.footer-bottom a{min-height:48px;font-size:14px}
.brand-story-entry{margin-top:24px}.brand-story-entry .text-link{margin-top:0}
.brand-hero{align-items:center}.brand-hero h1{font-size:48px}.brand-hero .detail-lead{font-size:36px;margin-top:20px}.brand-intro{font-size:18px;line-height:1.8;margin-top:24px;max-width:520px}
.brand-hero-logo{margin:0;padding:24px}.brand-hero-logo img{width:100%;height:auto}.brand-hero-logo figcaption{text-align:center;margin-top:24px}
body.brand-page .detail-section-body p.brand-thought{font-family:var(--serif);font-size:28px!important;line-height:1.8!important;margin-bottom:32px}
.brand-symbol-figure{margin:0 0 40px;padding:32px}.brand-symbol-figure img{width:100%;height:auto}
.brand-meaning article{padding-block:28px;border-top:1px solid var(--line)}.brand-meaning h3{font-size:24px;margin-bottom:16px}
.brand-color-flow{height:32px;margin-top:32px;background:linear-gradient(115deg,#193D58 0%,#193D58 60%,#60516E 85%,#914F60 100%)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #193D58;outline-offset:4px;box-shadow:0 0 0 4px #FFFFFF}
.dark-section a:focus-visible,.story-mid-cta a:focus-visible{outline-color:#FFFFFF;box-shadow:0 0 0 4px #14213D}
@media(min-width:1024px){.site-header nav>a:nth-child(1){display:flex}.mobile-site-navigation{display:none!important}.menu-toggle{display:none!important}}
@media(max-width:1023px){:root{--brand-header:64px}.shell{width:calc(100% - 64px)}.site-header{height:64px;padding-inline:32px}.site-header .brand{min-height:64px;width:124px;padding:10px}.site-header .menu-toggle{display:flex;align-items:center;justify-content:center;gap:12px;min-width:100px;min-height:48px;padding:8px;background:none;border:0;border-radius:4px}.menu-label{font-size:16px}.site-header nav{display:none;position:absolute;left:0;right:0;top:64px;padding:24px 32px;background:#FFFFFF;border-bottom:1px solid var(--line);max-height:calc(100svh - 64px);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 8px 24px rgba(20,33,61,.12)}.site-header nav.open{display:block}.site-header nav>a{display:none!important}.site-header nav .mobile-site-navigation{display:grid;grid-template-columns:1fr 1fr;gap:24px 32px}.mobile-nav-group{display:flex;flex-direction:column}.mobile-nav-group p{font-size:16px;color:var(--muted);margin:0 0 8px}.site-header nav .mobile-nav-group a{display:flex;min-height:48px;padding:12px 0;font-size:16px;border-bottom:1px solid var(--line);line-height:1.5}.site-header nav .mobile-site-navigation>.nav-action{display:flex;align-items:center;justify-content:space-between;margin:0;padding:12px 24px;align-self:start;min-height:48px}.menu-lines{width:22px;height:14px;border-top:1px solid var(--navy);border-bottom:1px solid var(--navy);position:relative}.menu-toggle[aria-expanded=true] .menu-lines{border:0}.menu-toggle[aria-expanded=true] .menu-lines:before,.menu-toggle[aria-expanded=true] .menu-lines:after{content:"";position:absolute;left:0;top:6px;width:22px;height:1px;background:var(--navy);transform:rotate(45deg)}.menu-toggle[aria-expanded=true] .menu-lines:after{transform:rotate(-45deg)}.detail-hero,.rep-hero{gap:40px}.detail-hero h1{font-size:44px}.bridge{grid-template-columns:1fr 24px 1.3fr 24px 1fr}.bridge-core h3,.bridge-end h3{font-size:20px}.core-tags{gap:8px}.bridge-core{width:220px;height:220px}.bridge-core p,.bridge-end p,.core-tags{font-size:14px}.process-flow h3{font-size:20px}.metrics .metric-value{font-size:56px}.company-grid{gap:32px}.privacy-main{width:calc(100% - 64px)}.hero{height:auto;min-height:680px}.hero-content{padding-block:64px 96px}}
@media(max-width:767px){.shell{width:calc(100% - 40px)}.site-header{padding-inline:20px}.site-header .brand{width:116px;padding:10px 6px}.site-header nav{padding:24px 20px}.site-header nav .mobile-site-navigation{grid-template-columns:1fr;gap:24px}.section{padding-block:64px}.detail-section,.rep-section{padding-block:64px;grid-template-columns:1fr;gap:24px}.section-meta{margin-bottom:32px}.split-heading{grid-template-columns:1fr;gap:24px;margin-bottom:32px}body main h1,.hero h1,.detail-hero h1,.rep-hero h1,.privacy-main h1,.brand-hero h1{font-size:36px;line-height:1.35}body main h2,.detail-section h2,.rep-section h2,.detail-contact h2,.rep-contact h2,.story-section-heading h2,.current-advisory h2,.business-background h2{font-size:28px;line-height:1.45}body main h3,.detail-offers h3,.service-name h3,.choice-row h3,.workflow-line h3{font-size:24px;line-height:1.45}.hero{min-height:720px;max-height:none;justify-content:flex-start}.hero-content{padding-top:40px;padding-bottom:230px}.hero h1{font-size:36px;line-height:1.35;margin-bottom:24px}.hero-lead{font-size:18px;line-height:1.8}.hero-description{font-size:16px;max-width:360px}.hero .eyebrow{font-size:14px;letter-spacing:.07em;margin-bottom:24px}.hero-art{top:290px}.hero:after{background:linear-gradient(180deg,#F6F8FA 0%,#F6F8FA 38%,rgba(246,248,250,.93) 49%,rgba(246,248,250,.1) 82%)}.hero-actions{gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.hero-actions .button{padding:12px;font-size:16px;gap:8px;min-height:72px}.hero-actions .button-label{font-size:16px}.hero-actions .button span[aria-hidden]{font-size:18px}.hero-bottom>span{font-size:12px;line-height:1.5;max-width:155px}.hero-bottom a{font-size:14px;min-height:48px}.home-routes{padding-block:32px}.home-routes h2{font-size:24px}.home-route{font-size:18px}.bridge{grid-template-columns:1fr;gap:0}.bridge-core{width:250px;height:250px}.bridge-core h3,.bridge-end h3{font-size:24px}.bridge-core p,.bridge-end p,.core-tags{font-size:16px}.service-row{padding-block:32px;gap:24px}.usecase-tabs button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;font-size:14px;gap:8px;min-height:88px;padding:12px}.usecase-tabs button span{font-size:16px}.usecase-panel{padding:28px 20px}.usecase-top{gap:24px}.usecase-top h3{font-size:24px}.human-note{gap:12px;align-items:flex-start}.human-note>span{min-width:0}.case-flow{grid-template-columns:1fr;margin-block:32px}.case-node h4{font-size:18px}.process-flow{gap:32px}.process-flow h3{font-size:24px}.metrics .metric-value{font-size:64px}.metrics h3{font-size:24px}.metrics>div{padding:24px 0}.philosophy{padding-block:64px}.philosophy h2{font-size:24px;line-height:1.9}.recommendation{padding:24px}.recommendation h3{font-size:24px}.company-grid{gap:32px}.company-message{font-size:24px}.company-details>div{gap:12px;font-size:16px}.company-details dt{font-size:16px}.detail-hero,.rep-hero{grid-template-columns:1fr;gap:24px;padding-block:24px 48px}.detail-lead,.story-hero .detail-lead,.rep-statement{font-size:24px;line-height:1.7}.detail-hero h1{margin-block:16px 24px}.detail-focus{padding:28px 20px;border-radius:8px}.detail-focus h2{font-size:28px}.detail-focus .detail-philosophy{font-size:22px!important}.detail-contact,.rep-contact{padding-block:64px}.story-mid-cta{padding:28px 24px;gap:24px}.story-mid-cta h2{font-size:24px}.story-mid-cta .button{font-size:16px}.story-shortcuts a{font-size:16px}.reading-item>summary,.faq-answer>summary,.detail-faq summary,.profile summary{font-size:18px;padding-block:20px}.reading-body h3,.qa-answers h3,.longform-prose h3{font-size:24px}.change-row p{font-size:18px}.workflow-line{gap:40px}.workflow-line li+li:before{top:-36px}.workflow-note{font-size:14px}.faq-tools{padding:24px 20px;grid-template-columns:1fr}.privacy-main{width:calc(100% - 40px);padding:32px 0 64px}.privacy-main h2{font-size:24px}.privacy-main h3{font-size:20px}.site-footer{padding-block:48px 24px}.footer-sitemap{padding-block:24px;gap:24px!important}.footer-bottom{align-items:flex-start;gap:20px}.brand-hero-logo{padding:24px 12px}.brand-hero .detail-lead{font-size:28px}.brand-intro{font-size:18px}.brand-thought{font-size:24px!important}.brand-symbol-figure{padding:24px 0}.brand-meaning h3{font-size:24px}.detail-breadcrumb,.rep-breadcrumb{font-size:14px}.detail-breadcrumb a,.rep-breadcrumb a{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:767px){body main .philosophy h2{font-size:24px;line-height:1.9}.philosophy h2>span{white-space:normal;overflow-wrap:anywhere}body.brand-page .detail-section-body p.brand-thought{font-size:24px!important}.hero-bottom a{white-space:nowrap}}
.service-name>div,.service-row>*,.metrics>div{min-width:0}.eyebrow,.metric-label{overflow-wrap:anywhere}@media(max-width:767px){.service-row{grid-template-columns:minmax(0,1fr)}.metrics{grid-template-columns:minmax(0,1fr)}.metrics>div{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.hero-bottom a{white-space:normal;min-width:0;overflow-wrap:anywhere}.hero-bottom{gap:16px}.hero-bottom>span{min-width:0}.choice-row>*{min-width:0}}
@media(max-width:767px){.choice-row{grid-template-columns:max-content minmax(0,1fr) max-content}.choice-number,.choice-arrow{width:auto;min-width:max-content}}
.detail-hero h1,.rep-hero h1{text-wrap:balance}

/* Company philosophy: approved lockup alongside the formal philosophy. */
.company-philosophy{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:48px}
.company-philosophy-copy{min-width:0}
.company-philosophy-logo{margin:0;padding:24px;background:#fff;border-radius:8px}
.company-philosophy-logo img{display:block;width:100%;height:auto}
@media(max-width:1023px){.company-philosophy{grid-template-columns:1fr;gap:32px}.company-philosophy-logo{width:min(100%,460px);justify-self:center;box-sizing:border-box}}
@media(max-width:767px){.company-philosophy .detail-philosophy{font-size:20px!important}}
