/* /lp-renewal/ visual language: bright BtoB, bold outlines and offset shadows. */
:root{--bg:#fff;--paper:#fff;--ink:#264280;--navy:#264280;--muted:#536384;--line:#cad3e5;--teal:#176f68;--teal-dark:#105751;--teal-soft:#e7f3f0;--yellow:#fdd000;--sky:#66bfd6;--cream:#fdface;--pale-blue:#eaf7fb;--red:#a33f3b;--max:1160px}
html{max-width:100%;overflow-x:clip;scroll-padding-top:86px}
body{max-width:100%;overflow-x:clip;color:var(--ink);background:#fff;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;font-weight:500;line-height:1.8}
h1,h2,h3{overflow-wrap:normal;word-break:auto-phrase;line-break:strict;text-wrap:pretty}p,li,label,a{word-break:auto-phrase;line-break:strict}
.phrase{display:inline-block;max-width:100%;white-space:nowrap}
.site-header{position:sticky;top:0;height:84px;padding-inline:max(24px,calc((100% - var(--max))/2));border:0;background:rgba(255,255,255,.96);box-shadow:0 4px 0 rgba(38,66,128,.08);backdrop-filter:blur(12px)}
.brand{display:inline-flex;align-items:center;gap:11px;color:var(--ink);font:inherit;letter-spacing:0}.brand-mark{display:grid;width:42px;height:42px;flex:0 0 auto;place-content:center;border:3px solid var(--ink);border-radius:50%;color:var(--ink);background:var(--yellow);font-size:18px;font-weight:900;box-shadow:3px 3px 0 var(--ink)}
.brand-copy strong,.brand-copy small{display:block;line-height:1.3}.brand-copy strong{font-size:15px;font-weight:900}.brand-copy small{margin-top:2px;color:var(--muted);font:700 9px/1.3 Arial,sans-serif;letter-spacing:.12em}
.header-cta{padding:11px 22px;border:2px solid var(--ink);border-radius:7px;color:var(--ink);background:var(--yellow);box-shadow:4px 4px 0 var(--ink);font-weight:900;transition:.18s ease}.header-cta:hover{color:#fff;background:var(--ink);box-shadow:none;transform:translate(3px,3px)}
.section{position:relative;overflow:hidden;padding:clamp(82px,10vw,132px) 0}.section h2{color:var(--ink);font-size:clamp(35px,4.5vw,57px);font-weight:900;letter-spacing:.015em;line-height:1.45}
.eyebrow{display:inline-block;width:fit-content;margin-bottom:22px;padding:7px 14px;border:2px solid var(--ink);border-radius:5px;color:var(--ink);background:#fff;box-shadow:4px 4px 0 var(--yellow);font-size:12px;font-weight:900;letter-spacing:.07em}.overline{color:var(--teal);font-weight:900}.lead{color:var(--muted);font-weight:600}
.button{min-height:58px;border:2px solid var(--ink);border-radius:7px;color:var(--ink);background:var(--yellow);box-shadow:5px 5px 0 var(--ink);font-weight:900}.button:hover{color:#fff;background:var(--ink);border-color:var(--ink);box-shadow:none;transform:translate(4px,4px)}
.hero{position:relative;overflow:hidden;isolation:isolate;background:#fff}.hero:before{content:"";position:absolute;z-index:-2;right:-8%;bottom:0;width:59%;height:92%;border-radius:48% 0 0;background:var(--pale-blue);transform:skewX(-7deg)}.hero:after{content:"";position:absolute;z-index:-1;top:8%;left:-70px;width:150px;height:150px;border:24px solid var(--yellow);border-radius:50%;opacity:.6}
.hero-grid{min-height:645px;grid-template-columns:minmax(0,.92fr) minmax(330px,.78fr);gap:7%;padding-top:68px;padding-bottom:72px}.hero-copy{padding-left:0;border-left:0}.hero h1{color:var(--ink);font-size:clamp(40px,4.1vw,56px);font-weight:900;line-height:1.38;letter-spacing:.015em}.hero h1 .phrase{color:var(--ink)}.hero h1 .highlight .phrase{background:linear-gradient(transparent 63%,var(--yellow) 0);-webkit-box-decoration-break:clone;box-decoration-break:clone}.hero h1 .plain{background:none}.hero-lead{color:var(--muted);font-weight:600}
.security-brief{position:relative;margin:0 8px 8px 0;padding:34px 32px;border:3px solid var(--ink);border-top:9px solid var(--red);border-radius:15px;background:#fff;box-shadow:9px 9px 0 var(--sky)}.brief-icon{border:2px solid var(--ink);border-radius:50%;background:#fff3f0}.brief-date{color:var(--red);font-weight:900}.security-brief h2{color:var(--ink);font-weight:900}.security-brief>p:not(.brief-date){color:var(--muted)}.security-brief a{color:var(--ink);font-weight:900}
.trust-bar{color:#fff;background:var(--ink)}.trust-grid strong{color:var(--yellow);font-weight:900}.trust-grid span{color:#fff}
.security-section{background:var(--cream)}.security-section:after{content:"PHP";position:absolute;right:-15px;bottom:-55px;color:rgba(102,191,214,.17);font-size:clamp(120px,18vw,250px);font-weight:900;line-height:1}.security-section>.shell{position:relative;z-index:1}
.section-icon{border:3px solid var(--ink);border-radius:12px;background:#fff;box-shadow:7px 7px 0 var(--sky)}.fact-panel{border:3px solid var(--ink);border-radius:15px;background:var(--ink);box-shadow:9px 9px 0 var(--yellow);overflow:hidden}.fact-main h3{font-weight:900}.version-note{background:#345694}.source-row{border:3px solid var(--ink);border-top:0;border-radius:0 0 12px 12px;overflow:hidden}.source-row a strong{color:var(--ink)}.calm-note{border:3px solid var(--ink);border-left-width:3px;border-radius:12px;background:#fff;box-shadow:7px 7px 0 var(--sky)}
.wordpress-section{background:#fff}.wordpress-section:before{content:"";position:absolute;top:10%;right:-60px;width:165px;height:165px;border:22px solid var(--cream);border-radius:50%}.wordpress-section>.shell{position:relative;z-index:1}.system-compare{gap:18px}.system-compare article{border:3px solid var(--ink);border-radius:12px;background:#fff;box-shadow:7px 7px 0 var(--sky)}.system-compare article:last-child{box-shadow:7px 7px 0 var(--yellow)}.system-compare h3{color:var(--ink);font-weight:900}.number{display:grid;width:32px;height:32px;place-content:center;border:2px solid var(--ink);border-radius:50%;color:var(--ink);background:var(--yellow);font-weight:900}.not-equal{color:var(--ink);font-weight:900}.separate-note{border:3px solid var(--ink);border-radius:10px;background:var(--pale-blue)}.separate-note a{color:var(--ink);font-weight:900}
.impact-section{background:var(--pale-blue)}.impact-section:before{content:"";position:absolute;top:35px;left:-60px;width:150px;height:150px;border:22px solid #fff;border-radius:50%}.impact-section>.shell{position:relative;z-index:1}.impact-grid{gap:22px}.impact-grid article{border:3px solid var(--ink);border-bottom:9px solid var(--red);border-radius:14px;box-shadow:7px 7px 0 var(--sky)}.impact-grid h3{color:var(--ink);font-weight:900}.visual-warning{border:3px solid var(--ink);border-radius:10px;background:var(--ink);box-shadow:7px 7px 0 var(--yellow)}
.needs-section{background:var(--cream)}.needs-list{border-top:3px solid var(--ink)}.needs-list li{padding-inline:16px;border-bottom:2px solid #d7cc85;background:rgba(255,255,255,.6)}.needs-list li:nth-child(even){background:#fff}.needs-list span{display:grid;width:32px;height:32px;place-content:center;border:2px solid var(--ink);border-radius:50%;color:var(--ink);background:var(--yellow);font-weight:900}
.services-section{background:#fff}.services-section:after{content:"SUPPORT";position:absolute;right:-12px;bottom:-50px;color:rgba(102,191,214,.13);font-size:clamp(95px,15vw,200px);font-weight:900;line-height:1}.services-section>.shell{position:relative;z-index:1}.service-grid{gap:22px}.service-grid article,.service-grid article.featured{border:3px solid var(--ink);border-top:9px solid var(--sky);border-radius:15px;box-shadow:8px 8px 0 var(--sky)}.service-grid article:nth-child(2){border-top-color:var(--yellow);box-shadow:8px 8px 0 var(--yellow)}.service-grid article:nth-child(3){border-top-color:var(--teal);box-shadow:8px 8px 0 #9dd7cc}.service-grid h3{color:var(--ink);font-weight:900}.service-grid .fit{color:var(--ink);font-weight:900}.service-note{border:3px solid var(--ink);border-radius:12px;background:var(--cream);box-shadow:7px 7px 0 var(--yellow)}
.flow-section{background:var(--pale-blue);color:var(--ink)}.flow-section h2{color:var(--ink)}.flow-heading>p{color:var(--muted)}.flow-list{gap:12px;border:0}.flow-list li{min-height:245px;border:3px solid var(--ink);border-radius:10px;background:#fff;box-shadow:5px 5px 0 var(--sky)}.flow-list li:nth-child(even){box-shadow:5px 5px 0 var(--yellow)}.flow-list span{display:grid;width:31px;height:31px;margin-bottom:30px;place-content:center;border-radius:50%;color:var(--ink);background:var(--yellow);font-weight:900}.flow-list img{filter:none}.flow-list h3{color:var(--ink);font-weight:900}.flow-list p{color:var(--muted)}
.form-section{background:var(--yellow)}.form-section:before,.form-section:after{content:"";position:absolute;border:18px solid #fff;border-radius:50%;opacity:.7}.form-section:before{top:12%;left:-70px;width:150px;height:150px}.form-section:after{right:-40px;bottom:8%;width:110px;height:110px}.form-layout{position:relative;z-index:1}.form-intro h2{color:var(--ink);font-weight:900}.form-intro>p:not(.eyebrow){color:var(--ink)}.form-promise{border:2px solid var(--ink);border-radius:8px;padding:18px;background:var(--pale-blue)}.consultation-form{border:3px solid var(--ink);border-radius:16px;background:#fff;box-shadow:10px 10px 0 var(--ink)}.field>label,.field legend{color:var(--ink);font-weight:900}.field input[type=text],.field input[type=email],.field textarea{border:2px solid var(--ink);border-radius:6px}.field input:focus,.field textarea:focus{border-color:var(--ink);outline:3px solid var(--sky)}.required{background:var(--red)}.optional{color:var(--ink);background:var(--cream)}.checkbox{position:relative;margin-bottom:9px!important;padding:14px 15px;border:2px solid var(--line)!important;border-radius:8px;background:#fff}.checkbox:has(input:checked){border-color:var(--ink)!important;background:var(--cream);box-shadow:4px 4px 0 var(--yellow)}.submit-button{border-color:var(--ink);color:var(--ink);background:var(--yellow)}
.site-footer{color:#fff;background:var(--ink);border:0}.site-footer .brand{color:#fff}.site-footer .brand-mark{color:var(--ink)}.site-footer p,.site-footer small{color:#fff}.site-footer .shell>a:not(.brand){color:#fff}
.thanks-page{background:var(--pale-blue)}.thanks-card{border:3px solid var(--ink);border-top:9px solid var(--yellow);border-radius:15px;box-shadow:9px 9px 0 var(--sky)}.thanks-card h1{color:var(--ink);font-weight:900}.policy-main{background:var(--cream)}.policy-main h1,.policy-main h2{color:var(--ink);font-weight:900}.policy-main section{border-top:2px solid #d7cc85}.policy-main section>span{display:grid;width:32px;height:32px;place-content:center;border:2px solid var(--ink);border-radius:50%;color:var(--ink);background:var(--yellow);font-weight:900}
@media(max-width:900px){.hero-grid{min-height:0;grid-template-columns:1fr}.security-brief{max-width:620px}.service-grid article{min-height:0}.form-intro{position:static}}
@media(max-width:650px){.site-header{height:66px}.brand-mark{width:34px;height:34px;border-width:2px;box-shadow:2px 2px 0 var(--ink)}.brand-copy strong{font-size:11px}.brand-copy small{font-size:8px}.hero{padding-top:48px}.hero:before{width:100%;height:43%;border-radius:40% 0 0}.hero:after{top:18px;left:-62px;width:105px;height:105px;border-width:16px}.hero h1{font-size:clamp(34px,9.8vw,49px)}.security-brief,.fact-panel,.service-grid article{box-shadow:6px 6px 0 var(--sky)}.consultation-form{box-shadow:6px 6px 0 var(--ink)}.system-compare{gap:0}.not-equal{min-height:65px}.flow-list{gap:10px}.flow-list li{border-width:2px}.header-cta{box-shadow:none}}

/* Layout stability: keep Japanese text and PNG illustrations inside narrow viewports. */
.site-header>*{min-width:0}
.brand-copy{min-width:0}
.brief-icon,.section-icon{flex:0 0 auto;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}
.brief-icon{width:108px;height:108px;display:block;margin-bottom:14px}
.brief-icon img{width:108px;height:108px;max-width:none;object-fit:contain}
.section-icon{width:128px;height:128px;display:block}
.section-icon img{width:128px;height:128px;max-width:none;object-fit:contain}
.impact-grid img{width:104px;height:104px;max-width:none;margin-bottom:18px;object-fit:contain}
.service-top img{width:84px;height:84px;max-width:none;flex:0 0 84px;object-fit:contain}
.flow-list img{width:72px;height:72px;max-width:none;margin-bottom:15px;object-fit:contain}
.calm-note img{width:56px;height:56px;max-width:none;flex:0 0 56px;object-fit:contain}
.form-promise img{width:64px;height:64px;max-width:none;flex:0 0 64px;object-fit:contain}
.thanks-card>img{width:96px;height:96px;max-width:none;object-fit:contain}
.source-row a,.fact-panel>*,.system-compare>*,.service-grid>*,.flow-list>*{min-width:0}
.split-heading>*,.centered-heading,.needs-grid>*,.flow-heading>*,.form-layout>*{min-width:0}
.source-row strong{overflow-wrap:anywhere}
.hero h1,.section h2,.security-brief h2,.fact-main h3,.service-grid h3,.flow-list h3{max-width:100%;overflow-wrap:anywhere;word-break:auto-phrase;text-wrap:pretty}

@media(max-width:650px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  .shell{width:calc(100% - 36px);max-width:100%}
  h1,h2,h3,p,li,label,a,strong,span{max-width:100%;line-break:strict}
  h1,h2,h3{overflow-wrap:anywhere;word-break:auto-phrase;text-wrap:pretty}
  p,li,label,a,strong,span{overflow-wrap:anywhere;word-break:auto-phrase}
  h1 br,h2 br{display:none}
  h1 wbr,h2 wbr{display:none}
  h1 .phrase,h2 .phrase{display:block;width:fit-content;overflow-wrap:normal;white-space:nowrap}
  .hero h1 .highlight{display:block;width:fit-content;max-width:100%}
  .hero h1 .highlight .phrase{display:block}
  .site-header{gap:10px;padding-inline:12px}
  .brand{min-width:0;gap:8px}
  .brand-copy{max-width:154px}
  .brand-copy strong{display:block;font-size:10px;line-height:1.35;white-space:normal}
  .brand-copy small{display:none}
  .header-cta{min-width:0;max-width:116px;padding:8px 10px;font-size:10px;line-height:1.35;text-align:center;white-space:normal}
  .section{padding:68px 0}
  .section h2{font-size:clamp(28px,8vw,34px);line-height:1.45;letter-spacing:0}
  .eyebrow{margin-bottom:18px;padding:6px 10px;font-size:10px;line-height:1.45}
  .hero-grid{width:calc(100% - 36px);gap:48px;padding-top:54px;padding-bottom:52px}
  .hero h1{font-size:clamp(29px,8.4vw,33px);line-height:1.48;letter-spacing:0}
  .hero h1 br{display:block}
  .hero h1 span{display:inline;white-space:normal}
  .hero-lead{margin-top:22px;font-size:15px;line-height:1.9}
  .hero-lead br{display:none}
  .hero .button{width:100%;max-width:330px}
  .security-brief{width:calc(100% - 6px);margin-right:6px;padding:27px 22px}
  .brief-icon{width:92px;height:92px}.brief-icon img{width:92px;height:92px}
  .security-brief h2{font-size:20px;line-height:1.55}
  .trust-grid p{padding-inline:4px}
  .split-heading{gap:22px}
  .section-icon{width:108px;height:108px}.section-icon img{width:108px;height:108px}
  .lead{font-size:16px;line-height:1.9}
  .fact-main{padding:30px 22px}.fact-main h3{font-size:21px}.version-note{padding:26px 22px}
  .source-row a{grid-template-columns:minmax(0,1fr) auto;padding:15px 16px}
  .calm-note{gap:14px;padding:20px 17px}
  .system-compare article{padding:25px 22px}
  .separate-note{padding:20px 18px}
  .centered-heading{margin-bottom:35px;text-align:left}
  .impact-grid article{padding:28px 22px}
  .impact-grid img{width:92px;height:92px}
  .visual-warning{gap:18px;padding:22px 18px}
  .needs-list li{grid-template-columns:44px minmax(0,1fr);padding:14px 10px}
  .needs-list strong{font-size:15px;line-height:1.6}
  .service-grid article{padding:25px 22px}.service-grid h3{font-size:21px}
  .service-top img{width:76px;height:76px;flex-basis:76px}
  .service-note{padding:22px 18px}
  .flow-list li{padding:22px;min-width:0}
  .flow-list img{width:68px;height:68px}
  .form-layout{width:calc(100% - 36px)}
  .form-intro h2{font-size:clamp(28px,8vw,34px);line-height:1.45}
  .form-promise{align-items:flex-start;gap:13px}
  .consultation-form{width:calc(100% - 6px);margin-right:6px;padding:27px 18px}
  .checkbox{padding:13px 12px}
  .site-footer .brand-copy{max-width:none}
  .policy-main h1{font-size:32px;line-height:1.45}
  .policy-main section{grid-template-columns:34px minmax(0,1fr)}
}

@media(max-width:370px){
  .brand-copy{max-width:128px}.brand-copy strong{font-size:9px}
  .header-cta{max-width:96px;padding-inline:7px;font-size:9px}
  .hero h1{font-size:29px}
  .section h2,.form-intro h2{font-size:27px}
}
