/* Shared Salon One identity for every public page. Loaded after page layouts. */
:root{--ink:#14243b;--ink2:#102035;--dark:#14243b;--text:#243449;--sub:#5b6877;--faint:#647181;--line:#dce2e8;--line2:#edf0f3;--bg:#f4f6f8;--surface:#fff;--navy:#14243b;--navy2:#253c58;--navy-soft:#36536f;--gold:#936d30;--gold2:#b79352;--goldbg:#f6f0e4;--teal:#08745a;--tealbg:#e9f4ef;--green:#08745a;--greenbg:#e9f4ef;--sans:-apple-system,BlinkMacSystemFont,'Hiragino Kaku Gothic ProN','Hiragino Sans','Noto Sans JP','Yu Gothic',sans-serif;--serif:'Hiragino Mincho ProN','Yu Mincho',serif;--shadow:0 10px 30px #14243b08;--shadow-soft:0 10px 30px #14243b08}
html{scroll-padding-top:96px}body[data-salon-page]{font-family:var(--sans);color:var(--text);line-height:1.9;-webkit-text-size-adjust:100%}body[data-salon-page] *{box-sizing:border-box}body[data-salon-page] p{overflow-wrap:anywhere}body[data-salon-page] img{max-width:100%}body[data-salon-page] :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--gold);outline-offset:4px}body[data-salon-page] :is(input,select,textarea){font-family:var(--sans);font-size:16px}body[data-salon-page] input:not([type=radio]):not([type=checkbox]),body[data-salon-page] select{min-height:44px}body[data-salon-page] :is(.btn,.cta,.submit,.pbtn,.cbtn){border-radius:8px;min-height:46px;box-shadow:none}body[data-salon-page] :is(h1,h2,h3){letter-spacing:.025em}
.so-brand-nav{position:sticky;top:0;z-index:100;background:#ffffffed;backdrop-filter:blur(16px);border-bottom:1px solid var(--line2);padding:0!important;padding-top:env(safe-area-inset-top)!important;margin:0!important;color:var(--navy);font-family:var(--sans)}.so-brand-nav-inner{width:min(1160px,calc(100% - 48px));height:80px;margin:auto;display:flex;align-items:center;gap:28px}.so-brand-logo{display:inline-flex;align-items:center;gap:10px;color:var(--navy)!important;font-family:var(--sans);font-size:23px!important;font-weight:700;text-decoration:none!important;letter-spacing:-.045em;white-space:nowrap}.so-brand-logo img{width:32px;height:32px;object-fit:contain;border-radius:6px}.so-brand-links{display:flex;align-items:center;gap:24px;margin-left:auto;font-size:14px}.so-brand-links a{text-decoration:none;color:var(--sub);padding:10px 0}.so-brand-links a:hover{color:var(--gold)}.so-brand-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;border:1px solid var(--navy);background:var(--navy);color:#fff!important;padding:9px 18px;min-height:44px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none!important;white-space:nowrap}.so-brand-cta:hover{background:var(--navy2)}.so-brand-footer{background:#fff!important;border-top:1px solid var(--line);padding:42px 0!important;color:var(--sub)!important;text-align:left!important}.so-brand-footer>div{width:min(1160px,calc(100% - 48px));margin:auto}.so-brand-footer p{font-size:13px!important;margin:14px 0 24px!important}.so-brand-footer nav{display:flex;flex-wrap:wrap;gap:12px 24px;font-size:13px;margin-bottom:24px}.so-brand-footer nav a{color:var(--sub)!important;text-decoration:none;padding:6px 0}.so-brand-footer nav a:hover{text-decoration:underline}.so-brand-footer small{font-size:12px}
body[data-salon-page=marketing],body[data-salon-page=guides],body[data-salon-page=legal]{background:#fff}body[data-salon-page=marketing] main.wrap{max-width:920px;padding-top:56px;padding-bottom:70px}body[data-salon-page=marketing] main.wrap>h1{font-family:var(--serif);font-size:clamp(30px,4vw,44px);line-height:1.65;font-weight:600;color:var(--ink)}body[data-salon-page=marketing] :is(.lead,.body){font-size:16px;line-height:2;color:var(--sub)}body[data-salon-page=marketing] :is(.hero,.head){background:var(--bg);color:var(--ink);box-shadow:none;border-radius:0;padding:55px 0}body[data-salon-page=marketing] .hero h1{color:var(--ink);font-family:var(--serif);font-size:clamp(30px,4vw,44px)}body[data-salon-page=marketing] .hero p{color:var(--sub);font-size:16px}body[data-salon-page=marketing] :is(.hero,.head) .eyebrow{color:var(--gold)!important}body[data-salon-page=marketing] :is(.step,.feat,.usecase,.fcard,.card){border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:none}body[data-salon-page=marketing] .feat :is(span,p){font-size:14px;line-height:1.9}body[data-salon-page=marketing] .final{background:var(--navy);border-radius:16px;box-shadow:none}body[data-salon-page=marketing] .final :is(h2,h3){color:#fff}body[data-salon-page=marketing] .final p{color:#d0d8e1}body[data-salon-page=marketing] .final .btn{background:#fff;color:var(--navy)}body[data-salon-page=marketing] .faq p{font-size:15px;line-height:2}body[data-salon-page=marketing] .faq h3{font-size:17px}body[data-salon-page=marketing] :is(.note,.disc){font-size:13px;line-height:1.9}body[data-salon-page=marketing] .g2{color:var(--gold)}
body[data-salon-page=article]{background:var(--bg)}body[data-salon-page=article] article.wrap{max-width:920px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:none;margin-top:32px;margin-bottom:50px;overflow:hidden}body[data-salon-page=article] article h1{font-family:var(--serif);font-size:clamp(28px,3.5vw,40px);font-weight:600;line-height:1.65;color:var(--ink)}body[data-salon-page=article] article :is(p,li){font-size:16px;line-height:2}body[data-salon-page=article] article h2{font-size:24px;border-color:var(--line);color:var(--ink);background:transparent}body[data-salon-page=article] article h3{font-size:20px}body[data-salon-page=article] :is(.point,.toc,.summary){background:var(--bg);border:1px solid var(--line);border-radius:12px;box-shadow:none}body[data-salon-page=article] .cta-box{background:var(--navy);border-radius:14px;box-shadow:none}body[data-salon-page=article] .cta-in :is(h3,p){color:#fff}body[data-salon-page=article] .cta-in>a{border-radius:8px;min-height:46px}body[data-salon-page=article] article .disc{font-size:12px}body[data-salon-page=guides] .head{background:var(--bg);color:var(--ink);padding:60px 0;border-bottom:1px solid var(--line)}body[data-salon-page=guides] .head h1{color:var(--ink);font-family:var(--serif);font-weight:600;line-height:1.65}body[data-salon-page=guides] .head p{color:var(--sub);font-size:16px}body[data-salon-page=guides] .head .eyebrow{color:var(--gold)}body[data-salon-page=guides] .card{border:1px solid var(--line);border-radius:12px;box-shadow:none}body[data-salon-page=guides] .card:hover{border-color:var(--gold);transform:none}body[data-salon-page=guides] .card h2{font-size:18px;line-height:1.7}body[data-salon-page=guides] .fchip{min-height:44px;border-radius:8px}
body[data-salon-page=legal] main{padding:46px 0 60px}body[data-salon-page=legal] h1{font-size:clamp(26px,3.5vw,38px);line-height:1.6}body[data-salon-page=legal] :is(p,li){font-size:15px;line-height:2}body[data-salon-page=legal] section{border-radius:10px;box-shadow:none;padding:24px;border:1px solid var(--line)}body[data-salon-page=legal] h2{font-size:18px;border-bottom:1px solid var(--line);padding-bottom:12px}body[data-salon-page=customer] header{background:var(--navy);border-radius:0 0 16px 16px;box-shadow:none}body[data-salon-page=customer] :is(.sec,.section){border-radius:12px;border-color:var(--line);box-shadow:none}body[data-salon-page=customer] label.q{font-size:14px}body[data-salon-page=customer] .hint{font-size:12px}body[data-salon-page=customer] .chip{min-height:44px}body[data-salon-page=customer] footer{font-size:12px}body[data-salon-page=admin] button{min-height:40px;border-radius:8px}
@media(max-width:700px){.so-brand-nav-inner{height:68px;width:calc(100% - 32px);gap:12px}.so-brand-logo{font-size:21px!important}.so-brand-logo img{width:28px;height:28px}.so-brand-links{display:none}.so-brand-cta{margin-left:auto;font-size:13px;padding:9px 12px}.so-brand-footer>div{width:calc(100% - 40px)}.so-brand-footer nav{gap:10px 18px;font-size:12px}body[data-salon-page=marketing] main.wrap{padding-top:34px}body[data-salon-page=marketing] main.wrap>h1{font-size:30px}body[data-salon-page=marketing] :is(.hero,.head){padding:36px 0}body[data-salon-page=marketing] table{font-size:13px;table-layout:fixed;width:100%;overflow-wrap:anywhere}body[data-salon-page=marketing] :is(th,td){padding:10px 8px;white-space:normal}body[data-salon-page=article] article.wrap{margin:20px 12px 30px;width:calc(100% - 24px)}body[data-salon-page=article] article h2{font-size:21px}body[data-salon-page=article] article h3{font-size:18px}body[data-salon-page=legal] :is(section,.box){padding:18px}body[data-salon-page=legal] h2{font-size:17px}body[data-salon-page=guides] .head{padding:40px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body[data-salon-page] *,body[data-salon-page] *:before,body[data-salon-page] *:after{animation:none!important;transition:none!important}}

/* Contrast for article summaries and consistent primary actions. */
body[data-salon-page=article] .summary{background:var(--navy);color:#fff}
body[data-salon-page=article] .summary :is(p,li,strong,b){color:#dce2e8}
body[data-salon-page=article] .summary .t{color:#fff}
body[data-salon-page=article] .demo-cta{background:var(--navy);border-radius:12px;box-shadow:none}
body[data-salon-page=article] .demo-cta .dc-p{color:#d0d8e1}
body[data-salon-page=article] .demo-cta .dc-btn,body[data-salon-page=article] .cta-in>a{background:#fff;color:var(--navy);border-radius:8px}
body[data-salon-page=article] .empathy{background:var(--goldbg);border:1px solid var(--line);border-radius:12px}
body[data-salon-page=article] .empathy p{color:var(--text)}
body[data-salon-page=article] article.wrap{padding:0 0 34px}
@media(max-width:600px){body[data-salon-page=article] .pad{padding:20px 18px 0}body[data-salon-page=article] table{table-layout:fixed;overflow-wrap:anywhere}body[data-salon-page=article] :is(th,td){padding:8px 6px}}

body[data-salon-page=admin] .btn:not(.sec){background:var(--navy);color:#fff}
body[data-salon-page=admin] .top .btn:not(.sec){background:#fff;color:var(--navy)}
body[data-salon-page=admin] .prevbody .empathy{background:var(--goldbg);border-color:var(--line)}
