@charset "UTF-8";
:root{--black:#050505;--white:#fff;--pink:#e31967;--gray:#f5f5f5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--black);background:#fff;font-family:Arial,"Helvetica Neue","Noto Sans JP",sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}img{display:block;width:100%}em{font-style:normal;color:var(--pink)}
.header{position:fixed;z-index:100;top:0;left:0;right:0;height:92px;padding:0 clamp(28px,5vw,84px);display:flex;align-items:center;justify-content:space-between;transition:.25s}.header.scrolled{height:76px;background:rgba(255,255,255,.94);box-shadow:0 8px 30px rgba(0,0,0,.06);backdrop-filter:blur(10px)}.logo{width:clamp(180px,18vw,252px)}.nav{display:flex;gap:clamp(18px,2.2vw,38px);align-items:center;font-size:12px;font-weight:800;letter-spacing:.14em}.nav a{position:relative;padding:12px 0}.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:2px;background:var(--pink);transition:.22s}.nav a:hover:after{right:0}.contact-link{color:var(--pink)}.menu-btn{display:none}
.hero{position:relative;min-height:820px;height:100svh;overflow:hidden;isolation:isolate;background:#fff}.copy{position:absolute;z-index:6;left:clamp(36px,5.2vw,96px);top:50%;transform:translateY(-45%);width:min(49vw,760px)}.en{margin:0 0 26px;font-size:clamp(58px,6.2vw,118px);font-weight:900;line-height:.82;letter-spacing:-.065em}.en span{display:block}.pink{color:var(--pink)}h1{display:inline-block;margin:0 0 26px;padding:11px 16px 13px;background:#050505;color:#fff;font-size:clamp(20px,1.7vw,31px);line-height:1.35;letter-spacing:.04em}.desc{margin:0 0 30px;font-size:clamp(14px,1.18vw,19px);line-height:1.78;font-weight:500}.cta{display:flex;gap:12px;flex-wrap:wrap}.btn{min-height:56px;padding:0 22px;display:inline-flex;align-items:center;justify-content:space-between;gap:24px;border:2px solid #050505;border-radius:10px;font-size:14px;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-3px)}.primary{background:var(--pink);border-color:var(--pink);color:#fff}.secondary{background:rgba(255,255,255,.92)}
.visual{position:absolute;z-index:2;inset:0 0 0 36%;overflow:hidden;opacity:0;animation:imageIn .9s ease .05s forwards}.visual picture,.visual img{width:100%;height:100%}.visual img{object-fit:cover;object-position:center}.visual:before{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.93) 8%,rgba(255,255,255,.34) 25%,rgba(255,255,255,0) 42%);pointer-events:none}.bigword{position:absolute;z-index:3;left:3.5vw;bottom:-.11em;white-space:nowrap;font-size:clamp(120px,13vw,250px);line-height:.8;font-weight:900;letter-spacing:-.075em;opacity:.075;pointer-events:none}.copy>*{opacity:0;transform:translateY(22px);animation:reveal .72s cubic-bezier(.2,.7,.2,1) forwards}.copy .en{animation-delay:.15s}.copy h1{animation-delay:.32s}.copy .desc{animation-delay:.48s}.copy .cta{animation-delay:.62s}@keyframes reveal{to{opacity:1;transform:none}}@keyframes imageIn{to{opacity:1}}
.mobile-menu{display:none}
.ticker{overflow:hidden;background:var(--black);color:#fff;border-top:1px solid #222;border-bottom:1px solid #222}.ticker-track{width:max-content;display:flex;align-items:center;gap:28px;padding:17px 0;font-size:18px;font-weight:900;letter-spacing:.12em;animation:ticker 22s linear infinite}.ticker-track i{color:var(--pink);font-style:normal}@keyframes ticker{to{transform:translateX(-50%)}}
.section{padding:clamp(88px,9vw,160px) clamp(24px,6vw,110px)}.section-kicker{display:flex;align-items:center;gap:12px;margin-bottom:clamp(45px,6vw,90px);font-size:12px;font-weight:900;letter-spacing:.18em}.section-kicker span{display:grid;place-items:center;width:34px;height:34px;border:1px solid #111;border-radius:50%;letter-spacing:0}
.about{background:#fff}.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(50px,9vw,150px);align-items:start}.mega{margin:0;font-size:clamp(58px,7.5vw,132px);line-height:.9;font-weight:900;letter-spacing:-.07em}.about-copy{padding-top:10px}.about-copy h2{margin:0 0 30px;font-size:clamp(34px,4vw,68px);line-height:1.12;letter-spacing:-.045em}.about-copy p{margin:0 0 22px;font-size:clamp(15px,1.25vw,19px);line-height:2}.pill-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(60px,8vw,110px)}.pill-row span{padding:12px 18px;border:1.5px solid #111;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.1em}
.possibility{background:var(--black);color:#fff}.section-kicker.light span{border-color:#fff}.possibility-head{display:grid;grid-template-columns:.6fr 1.4fr;gap:40px}.possibility-head .section-kicker{margin:0}.possibility-head h2{margin:0;font-size:clamp(44px,6.2vw,104px);line-height:.96;letter-spacing:-.055em}.possibility-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:clamp(65px,8vw,120px);background:#333;border:1px solid #333}.possibility-grid article{background:#050505;padding:clamp(28px,3.5vw,54px);min-height:310px}.possibility-grid strong{color:var(--pink);font-size:13px;letter-spacing:.12em}.possibility-grid h3{margin:70px 0 18px;font-size:clamp(26px,2.4vw,40px)}.possibility-grid p{margin:0;color:#cfcfcf;line-height:1.9;font-size:15px}
.creator{background:#f7f7f7}.creator-top{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(50px,10vw,150px);align-items:end}.label{margin:0 0 18px;color:var(--pink);font-size:12px;font-weight:900;letter-spacing:.16em}.creator-top h2{margin:0;font-size:clamp(50px,7vw,116px);line-height:.92;letter-spacing:-.065em}.creator-top h2 span{color:var(--pink)}.creator-intro p{margin:0 0 20px;font-size:clamp(15px,1.25vw,19px);line-height:1.95}
.support-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:clamp(60px,8vw,110px)}.support-grid article{position:relative;min-height:280px;padding:26px 22px;background:#fff;border-top:5px solid #050505;transition:.25s}.support-grid article:hover{transform:translateY(-8px);border-top-color:var(--pink)}.support-grid span{font-size:12px;font-weight:900;color:var(--pink)}.support-grid h3{margin:65px 0 18px;font-size:20px;line-height:1.4}.support-grid p{margin:0;font-size:14px;line-height:1.8;color:#555}.creator-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:clamp(60px,8vw,110px)}.creator-message{margin:0;font-size:clamp(34px,4vw,68px);line-height:1.04;font-weight:900;letter-spacing:-.045em}.creator-message strong{color:var(--pink)}.round-cta{width:min(360px,100%);min-height:82px;padding:0 28px;background:var(--pink);color:#fff;border-radius:999px;display:flex;align-items:center;justify-content:space-between;font-weight:900}.round-cta span{font-size:30px}

.business{background:#fff}
.business-head{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(50px,10vw,150px);align-items:end}
.business-head h2{margin:0;font-size:clamp(50px,7vw,116px);line-height:.92;letter-spacing:-.065em}
.business-head h2 span{color:var(--pink)}
.business-copy p{margin:0 0 20px;font-size:clamp(15px,1.25vw,19px);line-height:1.95}
.business-values{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-top:clamp(60px,8vw,110px);background:#ddd;border:1px solid #ddd}
.business-values article{background:#fff;padding:28px 22px;min-height:285px}
.business-values span{font-size:12px;font-weight:900;color:var(--pink)}
.business-values strong{display:block;margin:70px 0 18px;font-size:20px;line-height:1.35}
.business-values p{margin:0;font-size:14px;line-height:1.8;color:#555}
.business-cta-wrap{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:55px;padding-top:35px;border-top:1px solid #111}
.business-cta-wrap>p{margin:0;font-size:clamp(24px,2.4vw,38px);font-weight:900;letter-spacing:-.04em}
.round-cta.dark{background:#050505}

.service{background:#050505;color:#fff}
.service-head{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(50px,10vw,150px);align-items:end}
.service-head h2{margin:0;font-size:clamp(54px,7vw,118px);line-height:.92;letter-spacing:-.065em}
.service-head p{margin:0;color:#d7d7d7;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.service-list{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(60px,8vw,110px);background:#333;border:1px solid #333}
.service-list article{background:#050505;padding:30px 24px;min-height:250px;transition:.25s}
.service-list article:hover{background:#111}
.service-list span{font-size:12px;color:var(--pink);font-weight:900}
.service-list h3{margin:62px 0 18px;font-size:25px;letter-spacing:.02em}
.service-list p{margin:0;color:#bdbdbd;font-size:14px;line-height:1.8}

.product{background:#f7f7f7}
.product-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(50px,9vw,140px)}
.product-overline{margin:0 0 18px;color:var(--pink);font-size:12px;font-weight:900;letter-spacing:.16em}
.product h2{margin:0;font-size:clamp(46px,6vw,94px);line-height:1;letter-spacing:-.055em}
.product-copy>p{margin:0 0 42px;font-size:clamp(15px,1.25vw,19px);line-height:1.95}
.product-copy ol{list-style:none;margin:0;padding:0;border-top:1px solid #aaa}
.product-copy li{display:flex;gap:20px;align-items:center;padding:19px 0;border-bottom:1px solid #aaa;font-weight:800;font-size:15px;line-height:1.5}
.product-copy li span{color:var(--pink);font-size:11px;min-width:26px}
.matrix-note{margin-top:clamp(60px,8vw,110px);padding:clamp(30px,4vw,58px);background:#fff;border-left:8px solid var(--pink)}
.matrix-note strong{display:block;font-size:clamp(24px,3vw,44px);letter-spacing:-.03em}
.matrix-note p{max-width:850px;margin:18px 0 12px;line-height:1.9}
.matrix-note span{font-size:12px;color:#777}

.commerce{background:#050505;color:#fff}
.commerce-kicker{margin:0 0 18px;color:var(--pink);font-size:12px;font-weight:900;letter-spacing:.16em}
.commerce-head h2{margin:0;font-size:clamp(46px,6.5vw,108px);line-height:.98;letter-spacing:-.06em}
.commerce-head h2 em{color:var(--pink)}
.commerce-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:20px;align-items:center;margin-top:clamp(70px,9vw,130px)}
.commerce-flow article{min-height:230px;padding:28px;border:1px solid #333}
.commerce-flow article span{font-size:11px;color:var(--pink);font-weight:900}
.commerce-flow article h3{margin:55px 0 14px;font-size:22px}
.commerce-flow article p{margin:0;color:#c7c7c7;font-size:14px;line-height:1.8}
.commerce-flow>i{font-style:normal;color:var(--pink);font-size:24px}
.commerce-note{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end;margin-top:70px;padding-top:40px;border-top:1px solid #333}
.commerce-note h3{margin:0 0 16px;font-size:clamp(28px,3vw,46px)}
.commerce-note p{max-width:760px;margin:0;color:#c7c7c7;line-height:1.9}
.commerce-badge{width:190px;height:190px;border:1px solid #fff;border-radius:50%;display:grid;place-items:center;text-align:center;font-size:14px;font-weight:900;line-height:1.35;letter-spacing:.08em;transform:rotate(-8deg)}

.coming{min-height:35vh;border-top:1px solid #ddd}.coming>p{font-size:clamp(44px,7vw,100px);font-weight:900;color:#ddd}
@media(max-width:900px){.support-grid{grid-template-columns:repeat(2,1fr)}.support-grid article:last-child{grid-column:1/-1}.possibility-grid{grid-template-columns:1fr}.possibility-grid article{min-height:auto}.possibility-grid h3{margin-top:40px}}
@media(max-width:767px){
.header{height:72px;padding:0 20px}.header.scrolled{height:66px}.logo{width:164px}.nav{display:none}.menu-btn{display:grid;place-content:center;gap:7px;width:44px;height:44px;border:0;background:transparent}.menu-btn span{width:25px;height:2px;background:#050505;transition:.25s}.menu-btn.open span:first-child{transform:translateY(4.5px) rotate(45deg)}.menu-btn.open span:last-child{transform:translateY(-4.5px) rotate(-45deg)}.mobile-menu{position:fixed;z-index:90;inset:0;display:grid;place-items:center;background:#fff;opacity:0;visibility:hidden;transition:.25s}.mobile-menu.open{opacity:1;visibility:visible}.mobile-menu nav{display:flex;flex-direction:column;align-items:center;gap:20px;font-size:28px;font-weight:900}.mobile-menu nav a:last-child{color:var(--pink)}
.hero{min-height:100svh;height:auto;padding:104px 20px 0;display:flex;flex-direction:column}.copy{position:relative;left:auto;top:auto;transform:none;width:100%}.en{margin-bottom:16px;font-size:clamp(43px,13.8vw,62px)}h1{margin-bottom:16px;padding:8px 10px 9px;font-size:clamp(17px,5vw,22px)}.desc{margin-bottom:18px;font-size:14px;line-height:1.65}.pc{display:none}.cta{flex-direction:column;gap:9px;width:min(100%,360px)}.btn{width:100%;min-height:52px;padding:0 16px;font-size:13px}.visual{position:relative;inset:auto;width:calc(100% + 40px);height:min(55vh,570px);margin:14px -20px 0}.visual:before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.45) 8%,rgba(255,255,255,0) 20%)}.visual img{object-position:center 24%}.bigword{left:10px;bottom:2px;width:95vw;white-space:normal;font-size:clamp(72px,22vw,118px);line-height:.78;opacity:.08}
.ticker-track{font-size:13px;padding:13px 0;gap:18px}.section{padding:80px 20px}.section-kicker{margin-bottom:42px}.about-grid,.creator-top,.possibility-head{grid-template-columns:1fr;gap:42px}.mega{font-size:clamp(55px,18vw,82px)}.about-copy h2{font-size:38px}.possibility-head h2{font-size:clamp(44px,12vw,62px)}.possibility-grid{margin-top:55px}.possibility-grid article{padding:30px}.support-grid{grid-template-columns:1fr;gap:10px;margin-top:50px}.support-grid article,.support-grid article:last-child{grid-column:auto;min-height:220px}.support-grid h3{margin-top:38px}.creator-top h2{font-size:clamp(52px,15vw,76px)}.creator-bottom{align-items:stretch;flex-direction:column}.round-cta{width:100%}
.business-head,.service-head,.product-grid{grid-template-columns:1fr;gap:42px}
.business-values{grid-template-columns:1fr}
.business-values article{min-height:210px}
.business-values strong{margin-top:38px}
.business-cta-wrap{align-items:stretch;flex-direction:column}
.service-list{grid-template-columns:1fr}
.service-list article{min-height:210px}
.service-list h3{margin-top:38px}
.commerce-flow{grid-template-columns:1fr;gap:10px}
.commerce-flow>i{transform:rotate(90deg);justify-self:center}
.commerce-flow article{min-height:190px}
.commerce-flow article h3{margin-top:38px}
.commerce-note{grid-template-columns:1fr}
.commerce-badge{width:150px;height:150px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}


/* Ver.3.1 typography / line-break refinements */
.hero h1{
  white-space: nowrap;
}
.hero h1 .hero-br{
  display:none;
}
.about-copy h2,
.possibility-head h2,
.creator-top h2,
.business-head h2,
.service-head h2,
.product h2,
.commerce-head h2{
  text-wrap: balance;
}
.mega{
  text-wrap: balance;
}
.creator-message{
  white-space: nowrap;
}
.business-cta-wrap>p{
  white-space: nowrap;
}
.product-copy li{
  align-items:flex-start;
}
.product-copy li span{
  padding-top:.18em;
}
.commerce-head h2{
  max-width: 1280px;
}
@media (min-width: 1200px){
  .about-copy{max-width:620px}
  .business-copy{max-width:620px}
  .creator-intro{max-width:620px}
  .service-head p{max-width:620px}
  .product-copy{max-width:650px}
}
@media (max-width: 1199px) and (min-width: 768px){
  .hero h1{white-space:normal}
  .hero h1 .hero-br{display:block}
  .creator-message{white-space:normal}
  .business-cta-wrap>p{white-space:normal}
  .about-grid,
  .creator-top,
  .business-head,
  .service-head,
  .product-grid{
    gap:54px;
  }
}
@media (max-width:767px){
  .hero h1{white-space:normal}
  .hero h1 .hero-br{display:block}
  .creator-message{white-space:normal}
  .business-cta-wrap>p{white-space:normal}
  .mega,
  .about-copy h2,
  .possibility-head h2,
  .creator-top h2,
  .business-head h2,
  .service-head h2,
  .product h2,
  .commerce-head h2{
    text-wrap:pretty;
  }
}


/* Ver.3.2 Japanese line-break system */
.hero h1,
.mega,
.about-copy h2,
.possibility-head h2,
.creator-top h2,
.business-head h2,
.service-head h2,
.product h2,
.commerce-head h2 {
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}

.hero h1 > span,
.mega > span,
.about-copy h2 > span,
.possibility-head h2 > span,
.creator-top h2 > span,
.business-head h2 > span,
.service-head h2 > span,
.product h2 > span,
.commerce-head h2 > span {
  display: block;
}

.pink-text { color: var(--pink); }

.hero h1 {
  max-width: 720px;
}

.mega {
  max-width: 780px;
}

.about-copy h2 {
  max-width: 620px;
}

.possibility-head h2 {
  max-width: 1050px;
}

.creator-top h2,
.business-head h2 {
  max-width: 760px;
}

.service-head h2 {
  max-width: 820px;
}

.product h2 {
  max-width: 980px;
}

.commerce-head h2 {
  max-width: 1280px;
}

.creator-message,
.business-cta-wrap > p {
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}

@media (max-width: 1199px) {
  .hero h1,
  .mega,
  .about-copy h2,
  .possibility-head h2,
  .creator-top h2,
  .business-head h2,
  .service-head h2,
  .product h2,
  .commerce-head h2 {
    word-break: normal;
  }
}

@media (max-width: 767px) {
  .hero h1 > span,
  .mega > span,
  .about-copy h2 > span,
  .possibility-head h2 > span,
  .creator-top h2 > span,
  .business-head h2 > span,
  .service-head h2 > span,
  .product h2 > span,
  .commerce-head h2 > span {
    display: block;
  }

  .hero h1 {
    font-size: clamp(18px, 5vw, 23px);
    line-height: 1.4;
  }

  .mega {
    font-size: clamp(52px, 16vw, 76px);
    line-height: .95;
  }

  .about-copy h2 {
    font-size: clamp(34px, 10vw, 46px);
    line-height: 1.15;
  }

  .possibility-head h2,
  .creator-top h2,
  .business-head h2,
  .service-head h2,
  .product h2,
  .commerce-head h2 {
    font-size: clamp(40px, 11.5vw, 58px);
    line-height: 1.03;
  }

  .creator-message {
    font-size: clamp(30px, 9vw, 44px);
    line-height: 1.12;
  }
}


/* ===== Ver.4 FAQ / Related Business / Contact / Footer ===== */
.faq{background:#fff}
.faq-head{display:grid;grid-template-columns:1fr .9fr;gap:clamp(45px,9vw,130px);align-items:end}
.faq-head h2{margin:0;font-size:clamp(52px,7vw,112px);line-height:.92;letter-spacing:-.065em}
.faq-head>p{margin:0;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.faq-columns{display:grid;grid-template-columns:1fr 1fr;gap:clamp(35px,5vw,80px);margin-top:clamp(60px,8vw,110px)}
.faq-columns>div>h3{margin:0 0 20px;padding-bottom:18px;border-bottom:3px solid #050505;font-size:14px;letter-spacing:.14em}
.faq details{border-bottom:1px solid #cfcfcf}
.faq summary{list-style:none;position:relative;padding:24px 42px 24px 0;cursor:pointer;font-size:15px;font-weight:800;line-height:1.55}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before,.faq summary:after{content:"";position:absolute;right:4px;top:50%;width:16px;height:2px;background:#050505;transition:.2s}
.faq summary:after{transform:rotate(90deg)}
.faq details[open] summary:after{transform:rotate(0)}
.faq details[open] summary:before,.faq details[open] summary:after{background:var(--pink)}
.faq details p{margin:0;padding:0 42px 24px 0;color:#555;font-size:14px;line-height:1.9}

.neo{background:#050505;color:#fff}
.neo-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(50px,10vw,150px);align-items:end}
.neo-en{margin:0 0 18px;color:var(--pink);font-size:13px;font-weight:900;letter-spacing:.16em}
.neo h2{margin:0;font-size:clamp(54px,7vw,116px);line-height:.92;letter-spacing:-.065em}
.neo h2 span{display:block}
.neo-copy p{margin:0 0 20px;color:#ccc;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.neo-link{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;margin-top:20px;min-width:260px;padding:18px 0;border-bottom:1px solid #fff;font-weight:900}
.neo-link span{color:var(--pink);font-size:24px}

.contact{background:var(--pink);color:#fff}
.contact .section-kicker span{border-color:#fff}
.contact-small{margin:0 0 20px;font-size:12px;font-weight:900;letter-spacing:.16em}
.contact-head h2{margin:0;font-size:clamp(58px,8vw,132px);line-height:.88;letter-spacing:-.07em}
.contact-head h2 span{display:block}
.contact-head h2 em{color:#050505}
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:clamp(65px,8vw,115px);background:rgba(255,255,255,.35);border:1px solid rgba(255,255,255,.35)}
.contact-card{position:relative;min-height:330px;padding:30px;display:flex;flex-direction:column;justify-content:space-between;background:var(--pink);color:#fff;transition:.25s}
.contact-card:hover{background:#050505;transform:translateY(-6px)}
.card-num{font-size:11px;font-weight:900}
.contact-card small{display:block;margin-bottom:12px;font-size:11px;font-weight:900;letter-spacing:.14em}
.contact-card strong{display:block;font-size:clamp(22px,2.2vw,34px);line-height:1.25;letter-spacing:-.03em}
.contact-card p{margin:12px 0 0;font-size:13px;opacity:.78}
.contact-card>b{position:absolute;right:28px;bottom:25px;font-size:30px}

.footer{background:#050505;color:#fff;padding:70px clamp(24px,6vw,110px) 30px}
.footer-top{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding-bottom:70px}
.footer-brand{max-width:390px}
.footer-brand img{max-width:330px;filter:brightness(0) invert(1)}
.footer-brand p{margin:18px 0 0;color:#999;font-size:12px;letter-spacing:.08em}
.footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:14px 28px;align-content:start}
.footer-nav a{padding:10px 0;border-bottom:1px solid #333;font-size:12px;font-weight:800;letter-spacing:.1em;transition:.2s}
.footer-nav a:hover{color:var(--pink)}
.footer-bottom{display:flex;justify-content:space-between;gap:30px;padding-top:25px;border-top:1px solid #333;color:#777;font-size:11px}

@media(max-width:900px){
  .contact-cards{grid-template-columns:1fr}
  .contact-card{min-height:230px}
}
@media(max-width:767px){
  .faq-head,.faq-columns,.neo-grid,.footer-top{grid-template-columns:1fr;gap:42px}
  .faq-head h2{font-size:clamp(48px,14vw,68px)}
  .faq-columns{margin-top:50px}
  .faq summary{padding:21px 38px 21px 0}
  .neo h2{font-size:clamp(50px,14vw,72px)}
  .contact-head h2{font-size:clamp(54px,16vw,80px)}
  .contact-card{min-height:220px;padding:24px}
  .footer{padding-top:55px}
  .footer-top{padding-bottom:50px}
  .footer-brand img{max-width:260px}
  .footer-nav{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;gap:10px}
}


/* ===== Ver.5 ABOUT PAGE ===== */
.subpage{background:#fff}
.sub-hero{position:relative;min-height:760px;padding:180px clamp(24px,6vw,110px) 100px;overflow:hidden;display:flex;align-items:center;background:#f7f7f7}
.sub-hero-inner{position:relative;z-index:2;max-width:1180px}
.sub-kicker{margin:0 0 28px;color:var(--pink);font-size:12px;font-weight:900;letter-spacing:.18em}
.sub-hero h1{margin:0;font-size:clamp(66px,9vw,150px);line-height:.86;letter-spacing:-.075em}
.sub-hero h1 span{display:block}
.sub-lead{max-width:650px;margin:42px 0 0;font-size:clamp(16px,1.4vw,21px);line-height:1.9}
.sub-hero-word{position:absolute;right:-.03em;bottom:-.18em;font-size:clamp(190px,27vw,450px);font-weight:900;letter-spacing:-.08em;opacity:.04;line-height:.8}
.about-intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(50px,9vw,150px);align-items:start}
.values{background:#050505;color:#fff}
.values-head h2{margin:0;font-size:clamp(52px,7vw,112px);line-height:.92;letter-spacing:-.065em}
.values-head h2 span{display:block}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(65px,8vw,115px);background:#333;border:1px solid #333}
.values-grid article{min-height:350px;padding:30px 26px;background:#050505}
.values-grid article>span{color:var(--pink);font-size:11px;font-weight:900}
.values-grid h3{margin:70px 0 8px;font-size:14px;letter-spacing:.12em;color:#aaa}
.values-grid strong{display:block;margin-bottom:22px;font-size:clamp(24px,2.3vw,36px)}
.values-grid p{margin:0;color:#c9c9c9;font-size:14px;line-height:1.85}
.definition{background:#fff}
.definition-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(55px,10vw,150px)}
.definition-label{margin:0 0 18px;color:var(--pink);font-size:12px;font-weight:900;letter-spacing:.15em}
.definition h2{margin:0;font-size:clamp(50px,7vw,112px);line-height:.92;letter-spacing:-.06em}
.definition h2 span{display:block}
.definition-copy{padding-top:10px}
.definition-copy p{margin:0 0 22px;font-size:clamp(15px,1.2vw,19px);line-height:1.95}
.definition-copy .definition-main{font-size:clamp(22px,2.2vw,34px);font-weight:900;line-height:1.55}
.choice{background:#050505;color:#fff}
.choice-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(55px,10vw,150px)}
.choice h2{margin:0;font-size:clamp(48px,6.5vw,104px);line-height:.98;letter-spacing:-.055em}
.choice h2 span{display:block}
.choice-grid>div:last-child p{margin:0 0 22px;color:#ccc;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.relation{background:#f7f7f7}
.relation-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(55px,10vw,150px);align-items:end}
.relation-tag{margin:0 0 18px;color:var(--pink);font-size:12px;font-weight:900;letter-spacing:.16em}
.relation h2{margin:0;font-size:clamp(52px,7vw,112px);line-height:.92;letter-spacing:-.06em}
.relation h2 span{display:block}
.relation-copy p{margin:0 0 20px;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.black-link{border-bottom-color:#050505}
.about-final{background:var(--pink);color:#fff}
.about-final-small{margin:0 0 24px;font-size:12px;font-weight:900;letter-spacing:.16em}
.about-final h2{margin:0;font-size:clamp(58px,8vw,132px);line-height:.9;letter-spacing:-.07em}
.about-final h2 span{display:block}
.about-final h2 em{color:#050505}
.about-final-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:55px}
.about-final-actions .round-cta{min-width:320px}
.nav .active{color:var(--pink)}
@media(max-width:900px){
  .values-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .sub-hero{min-height:620px;padding:130px 20px 75px}
  .sub-hero h1{font-size:clamp(58px,17vw,82px);line-height:.9}
  .sub-lead{margin-top:30px;font-size:15px}
  .sub-hero-word{font-size:52vw;bottom:-.05em}
  .about-intro-grid,.definition-grid,.choice-grid,.relation-grid{grid-template-columns:1fr;gap:42px}
  .values-grid{grid-template-columns:1fr}
  .values-grid article{min-height:250px}
  .values-grid h3{margin-top:42px}
  .definition h2,.relation h2{font-size:clamp(48px,14vw,70px)}
  .choice h2{font-size:clamp(44px,12vw,62px)}
  .about-final h2{font-size:clamp(52px,15vw,76px)}
  .about-final-actions{flex-direction:column}
  .about-final-actions .round-cta{min-width:0;width:100%}
}


/* ===== Ver.5.1 ABOUT line-break fixes ===== */
.sub-hero.about-hero{
  min-height: 700px;
}
.sub-hero.about-hero .sub-hero-inner{
  max-width: 1240px;
}
.sub-hero.about-hero h1{
  display: inline-block;
  margin: 0;
  padding: 18px 22px 22px;
  background: #050505;
  color: #fff;
  font-size: clamp(62px, 7.4vw, 108px);
  line-height: .88;
  letter-spacing: -.075em;
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}
.sub-hero.about-hero h1 span{
  display: block;
}
.sub-hero.about-hero .sub-lead{
  max-width: 760px;
  margin-top: 26px;
}

.about-intro-grid,
.definition-grid,
.choice-grid,
.relation-grid{
  align-items: start;
}

.about-intro-grid .mega{
  max-width: 780px;
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}
.about-intro-grid .mega span{
  display: block;
}
.about-heading,
.definition-heading,
.choice-heading,
.relation-heading,
.about-final-heading{
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}
.about-heading span,
.definition-heading span,
.choice-heading span,
.relation-heading span,
.about-final-heading span{
  display: block;
}

.about-heading{
  max-width: 560px;
  font-size: clamp(38px, 4.1vw, 64px);
  line-height: 1.08;
}
.definition-heading{
  max-width: 420px;
  font-size: clamp(50px, 6.2vw, 92px);
  line-height: .96;
}
.choice-heading{
  max-width: 700px;
  font-size: clamp(46px, 5.8vw, 88px);
  line-height: .98;
}
.relation-heading{
  max-width: 520px;
  font-size: clamp(52px, 6.6vw, 98px);
  line-height: .93;
}
.about-final-heading{
  max-width: 1040px;
  font-size: clamp(58px, 7.5vw, 126px);
  line-height: .9;
}

.about-copy,
.definition-copy,
.relation-copy{
  max-width: 620px;
}

.about-final-actions{
  align-items: flex-start;
}

@media (max-width: 1024px){
  .sub-hero.about-hero h1{
    font-size: clamp(56px, 8vw, 84px);
  }
  .definition-heading{
    max-width: 520px;
    font-size: clamp(46px, 8vw, 74px);
  }
  .choice-heading{
    max-width: 720px;
    font-size: clamp(42px, 7vw, 68px);
  }
  .relation-heading{
    max-width: 560px;
    font-size: clamp(46px, 7.2vw, 76px);
  }
  .about-final-heading{
    font-size: clamp(54px, 8vw, 88px);
  }
}

@media (max-width: 767px){
  .sub-hero.about-hero{
    min-height: 560px;
    padding: 120px 20px 64px;
  }
  .sub-hero.about-hero h1{
    padding: 14px 14px 16px;
    font-size: clamp(42px, 11.8vw, 60px);
    line-height: .94;
  }
  .sub-hero.about-hero .sub-lead{
    max-width: 100%;
    margin-top: 22px;
    font-size: 14px;
    line-height: 1.85;
  }

  .about-intro-grid .mega{
    max-width: 100%;
    font-size: clamp(54px, 16vw, 76px);
    line-height: .93;
  }

  .about-heading{
    max-width: 100%;
    font-size: clamp(34px, 9.6vw, 44px);
    line-height: 1.12;
  }
  .definition-heading{
    max-width: 100%;
    font-size: clamp(42px, 12vw, 56px);
    line-height: .98;
  }
  .choice-heading{
    max-width: 100%;
    font-size: clamp(42px, 11.6vw, 54px);
    line-height: 1.02;
  }
  .relation-heading{
    max-width: 100%;
    font-size: clamp(44px, 12vw, 58px);
    line-height: .98;
  }
  .about-final-heading{
    max-width: 100%;
    font-size: clamp(48px, 12.6vw, 64px);
    line-height: .96;
  }
}


/* ===== Ver.6 CREATOR PAGE ===== */
.creator-hero{background:#f7f7f7}
.creator-hero h1{display:inline-block;padding:18px 22px 22px;background:#050505;color:#fff;font-size:clamp(62px,7.4vw,108px);line-height:.88;letter-spacing:-.075em;word-break:keep-all}
.creator-hero h1 span{display:block}
.creator-definition-grid,.creator-support-head,.creator-choice-grid,.creator-reward-grid,.creator-faq-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(55px,10vw,150px);align-items:start}
.creator-definition h2,.creator-support-head h2,.creator-choice h2,.creator-reward h2,.creator-flow-head h2,.creator-faq h2{margin:0;font-size:clamp(50px,6.7vw,108px);line-height:.94;letter-spacing:-.06em;word-break:keep-all}
.creator-definition h2 span,.creator-support-head h2 span,.creator-choice h2 span,.creator-reward h2 span,.creator-flow-head h2 span,.creator-faq h2 span{display:block}
.creator-definition-copy p,.creator-support-head>p,.creator-choice-grid>div:last-child p{margin:0 0 22px;font-size:clamp(15px,1.2vw,19px);line-height:1.95}
.lead-strong{font-size:clamp(22px,2.2vw,34px)!important;font-weight:900;line-height:1.55!important}

.creator-fit{background:#050505;color:#fff}
.creator-fit-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,10vw,150px);align-items:end}
.creator-fit-head h2{margin:0;font-size:clamp(54px,7vw,116px);line-height:.92;letter-spacing:-.065em}
.creator-fit-head h2 span{display:block}
.creator-fit-head>p{margin:0;color:#ccc;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.fit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(60px,8vw,110px);background:#333;border:1px solid #333}
.fit-grid article{min-height:270px;padding:28px 24px;background:#050505}
.fit-grid article>span{color:var(--pink);font-size:11px;font-weight:900}
.fit-grid strong{display:block;margin:70px 0 18px;font-size:clamp(24px,2.4vw,36px)}
.fit-grid p{margin:0;color:#c9c9c9;font-size:14px;line-height:1.85}
.fit-note{margin:24px 0 0;color:#aaa;font-size:12px}

.creator-support-detail{background:#fff}
.creator-support-head{align-items:end}
.creator-support-head>p{margin-bottom:0}
.support-detail-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:clamp(60px,8vw,110px)}
.support-detail-grid article{min-height:290px;padding:28px 22px;background:#f6f6f6;border-top:5px solid #050505;transition:.25s}
.support-detail-grid article:hover{transform:translateY(-7px);border-top-color:var(--pink)}
.support-detail-grid span{color:var(--pink);font-size:11px;font-weight:900}
.support-detail-grid h3{margin:65px 0 16px;font-size:20px;line-height:1.4}
.support-detail-grid p{margin:0;color:#555;font-size:14px;line-height:1.8}

.creator-choice{background:#050505;color:#fff}
.creator-choice-grid>div:last-child p{color:#ccc}
.choice-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(60px,8vw,110px)}
.choice-pills span{padding:12px 18px;border:1px solid #fff;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.1em}

.creator-reward{background:#f7f7f7}
.reward-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.reward-cards article{min-height:260px;padding:28px;background:#fff}
.reward-cards small{color:var(--pink);font-size:10px;font-weight:900;letter-spacing:.12em}
.reward-cards h3{margin:55px 0 14px;font-size:25px}
.reward-cards p{margin:0;color:#555;font-size:14px;line-height:1.85}

.creator-flow{background:#050505;color:#fff}
.flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(60px,8vw,110px);background:#333;border:1px solid #333}
.flow-grid article{min-height:280px;padding:28px 24px;background:#050505}
.flow-grid span{color:var(--pink);font-size:11px;font-weight:900;letter-spacing:.1em}
.flow-grid h3{margin:68px 0 18px;font-size:30px}
.flow-grid p{margin:0;color:#c8c8c8;font-size:14px;line-height:1.85}

.creator-faq{background:#fff}
.creator-faq details{border-bottom:1px solid #ccc}
.creator-faq summary{list-style:none;position:relative;padding:23px 40px 23px 0;cursor:pointer;font-weight:800;line-height:1.55}
.creator-faq summary::-webkit-details-marker{display:none}
.creator-faq summary:before,.creator-faq summary:after{content:"";position:absolute;right:4px;top:50%;width:16px;height:2px;background:#050505}
.creator-faq summary:after{transform:rotate(90deg)}
.creator-faq details[open] summary:after{transform:none}
.creator-faq details[open] summary:before,.creator-faq details[open] summary:after{background:var(--pink)}
.creator-faq details p{margin:0;padding:0 40px 22px 0;color:#555;font-size:14px;line-height:1.85}

.creator-contact{background:var(--pink);color:#fff}
.creator-contact h2{margin:0;font-size:clamp(58px,8vw,132px);line-height:.9;letter-spacing:-.07em}
.creator-contact h2 span{display:block}
.creator-contact h2 em{color:#050505}
.creator-contact-lead{max-width:720px;margin:35px 0 0;font-size:clamp(15px,1.2vw,18px);line-height:1.9}
.white-cta{background:#fff;color:#050505}

@media(max-width:1000px){
  .support-detail-grid{grid-template-columns:repeat(2,1fr)}
  .support-detail-grid article:last-child{grid-column:1/-1}
  .fit-grid,.flow-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .creator-hero h1{padding:14px 14px 16px;font-size:clamp(44px,12vw,60px);line-height:.94}
  .creator-definition-grid,.creator-support-head,.creator-choice-grid,.creator-reward-grid,.creator-faq-grid,.creator-fit-head{grid-template-columns:1fr;gap:42px}
  .creator-definition h2,.creator-support-head h2,.creator-choice h2,.creator-reward h2,.creator-flow-head h2,.creator-faq h2{font-size:clamp(44px,12vw,60px);line-height:1}
  .fit-grid,.flow-grid,.support-detail-grid,.reward-cards{grid-template-columns:1fr}
  .support-detail-grid article:last-child{grid-column:auto}
  .fit-grid article,.flow-grid article,.support-detail-grid article,.reward-cards article{min-height:210px}
  .fit-grid strong,.flow-grid h3,.support-detail-grid h3,.reward-cards h3{margin-top:38px}
  .creator-contact h2{font-size:clamp(50px,14vw,72px)}
}


/* ===== Ver.7 BUSINESS PAGE ===== */
.business-hero{background:#f7f7f7}
.business-hero h1{display:inline-block;padding:18px 22px 22px;background:#050505;color:#fff;font-size:clamp(62px,7.4vw,108px);line-height:.88;letter-spacing:-.075em;word-break:keep-all}
.business-hero h1 span{display:block}

.business-challenge-grid,.business-product-grid,.business-start-grid,.business-faq-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(55px,10vw,150px);align-items:start}
.business-challenge h2,.business-product h2,.business-flow-head h2,.business-start h2,.business-faq h2{margin:0;font-size:clamp(50px,6.7vw,108px);line-height:.94;letter-spacing:-.06em;word-break:keep-all}
.business-challenge h2 span,.business-product h2 span,.business-flow-head h2 span,.business-start h2 span,.business-faq h2 span{display:block}
.business-challenge-grid>div:last-child p,.business-product-copy>p{margin:0 0 22px;font-size:clamp(15px,1.2vw,19px);line-height:1.95}

.business-value{background:#050505;color:#fff}
.business-value-head h2{margin:0;font-size:clamp(52px,7vw,112px);line-height:.92;letter-spacing:-.065em}
.business-value-head h2 span{display:block}
.business-value-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-top:clamp(65px,8vw,115px);background:#333;border:1px solid #333}
.business-value-grid article{min-height:330px;padding:28px 22px;background:#050505}
.business-value-grid article>span{color:var(--pink);font-size:11px;font-weight:900}
.business-value-grid h3{margin:62px 0 8px;color:#aaa;font-size:12px;letter-spacing:.12em}
.business-value-grid strong{display:block;margin-bottom:18px;font-size:20px;line-height:1.4}
.business-value-grid p{margin:0;color:#c8c8c8;font-size:14px;line-height:1.85}

.business-product{background:#fff}
.business-product-copy ul{list-style:none;margin:36px 0 0;padding:0;border-top:1px solid #aaa}
.business-product-copy li{display:flex;gap:18px;align-items:flex-start;padding:19px 0;border-bottom:1px solid #aaa;font-weight:800;font-size:15px;line-height:1.5}
.business-product-copy li span{min-width:28px;color:var(--pink);font-size:11px;padding-top:.2em}

.business-service{background:#050505;color:#fff}
.business-service-head{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(50px,10vw,150px);align-items:end}
.business-service-head h2{margin:0;font-size:clamp(54px,7vw,118px);line-height:.92;letter-spacing:-.065em}
.business-service-head h2 span{display:block}
.business-service-head>p{margin:0;color:#ccc;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.business-service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(60px,8vw,110px);background:#333;border:1px solid #333}
.business-service-grid article{min-height:250px;padding:28px 24px;background:#050505;transition:.25s}
.business-service-grid article:hover{background:#111}
.business-service-grid span{color:var(--pink);font-size:11px;font-weight:900}
.business-service-grid h3{margin:58px 0 16px;font-size:24px}
.business-service-grid p{margin:0;color:#c2c2c2;font-size:14px;line-height:1.8}

.business-flow{background:#f7f7f7}
.business-flow-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-top:clamp(60px,8vw,110px);background:#ddd;border:1px solid #ddd}
.business-flow-grid article{min-height:280px;padding:28px 22px;background:#fff}
.business-flow-grid span{color:var(--pink);font-size:11px;font-weight:900;letter-spacing:.1em}
.business-flow-grid h3{margin:65px 0 18px;font-size:28px}
.business-flow-grid p{margin:0;color:#555;font-size:14px;line-height:1.85}

.business-start{background:#050505;color:#fff}
.stage-list{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#333;border:1px solid #333}
.stage-list>div{min-height:220px;padding:26px;background:#050505}
.stage-list span{color:var(--pink);font-size:11px;font-weight:900}
.stage-list strong{display:block;margin:45px 0 12px;font-size:23px}
.stage-list p{margin:0;color:#c8c8c8;font-size:14px;line-height:1.8}

.business-faq{background:#fff}
.business-faq details{border-bottom:1px solid #ccc}
.business-faq summary{list-style:none;position:relative;padding:23px 40px 23px 0;cursor:pointer;font-weight:800;line-height:1.55}
.business-faq summary::-webkit-details-marker{display:none}
.business-faq summary:before,.business-faq summary:after{content:"";position:absolute;right:4px;top:50%;width:16px;height:2px;background:#050505}
.business-faq summary:after{transform:rotate(90deg)}
.business-faq details[open] summary:after{transform:none}
.business-faq details[open] summary:before,.business-faq details[open] summary:after{background:var(--pink)}
.business-faq details p{margin:0;padding:0 40px 22px 0;color:#555;font-size:14px;line-height:1.85}

.business-contact{background:var(--pink);color:#fff}
.business-contact h2{margin:0;font-size:clamp(58px,8vw,132px);line-height:.9;letter-spacing:-.07em}
.business-contact h2 span{display:block}
.business-contact h2 em{color:#050505}
.business-contact-lead{max-width:760px;margin:35px 0 0;font-size:clamp(15px,1.2vw,18px);line-height:1.9}

@media(max-width:1050px){
  .business-value-grid{grid-template-columns:repeat(2,1fr)}
  .business-value-grid article:last-child{grid-column:1/-1}
  .business-service-grid{grid-template-columns:repeat(2,1fr)}
  .business-flow-grid{grid-template-columns:repeat(2,1fr)}
  .business-flow-grid article:last-child{grid-column:1/-1}
}
@media(max-width:767px){
  .business-hero h1{padding:14px 14px 16px;font-size:clamp(44px,12vw,60px);line-height:.94}
  .business-challenge-grid,.business-product-grid,.business-start-grid,.business-faq-grid,.business-service-head{grid-template-columns:1fr;gap:42px}
  .business-challenge h2,.business-product h2,.business-flow-head h2,.business-start h2,.business-faq h2{font-size:clamp(44px,12vw,60px);line-height:1}
  .business-value-grid,.business-service-grid,.business-flow-grid,.stage-list{grid-template-columns:1fr}
  .business-value-grid article:last-child,.business-flow-grid article:last-child{grid-column:auto}
  .business-value-grid article,.business-service-grid article,.business-flow-grid article,.stage-list>div{min-height:210px}
  .business-value-grid h3,.business-service-grid h3,.business-flow-grid h3,.stage-list strong{margin-top:38px}
  .business-contact h2{font-size:clamp(50px,14vw,72px)}
}


/* ===== Ver.7.1 BUSINESS line-break refinement ===== */

/* Japanese headline policy:
   - phrase-based manual line breaks
   - avoid automatic splitting inside semantic phrases
   - slightly smaller sizes where two-column width is narrow
*/
.business-page h1,
.biz-challenge-title,
.biz-value-title,
.biz-product-title,
.biz-service-title,
.biz-flow-title,
.biz-start-title,
.biz-faq-title,
.biz-contact-title {
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}

.business-page h1 > span,
.biz-challenge-title > span,
.biz-value-title > span,
.biz-product-title > span,
.biz-service-title > span,
.biz-flow-title > span,
.biz-start-title > span,
.biz-faq-title > span,
.biz-contact-title > span {
  display: block;
}

/* Hero: two clean lines */
.business-hero h1 {
  max-width: 860px;
  font-size: clamp(60px, 6.9vw, 100px);
  line-height: .92;
}

/* Two-column headings need more conservative sizing */
.biz-challenge-title {
  max-width: 760px;
  font-size: clamp(46px, 5.6vw, 82px) !important;
  line-height: .98 !important;
}

.biz-value-title {
  max-width: 980px;
  font-size: clamp(50px, 6.2vw, 94px) !important;
  line-height: .96 !important;
}

.biz-product-title {
  max-width: 800px;
  font-size: clamp(44px, 5.25vw, 78px) !important;
  line-height: 1.0 !important;
}

.biz-service-title {
  max-width: 780px;
  font-size: clamp(48px, 5.8vw, 88px) !important;
  line-height: .98 !important;
}

.biz-flow-title {
  max-width: 900px;
  font-size: clamp(48px, 5.8vw, 88px) !important;
  line-height: .98 !important;
}

.biz-start-title {
  max-width: 780px;
  font-size: clamp(44px, 5.3vw, 80px) !important;
  line-height: 1.0 !important;
}

.biz-faq-title {
  max-width: 700px;
  font-size: clamp(44px, 5.2vw, 78px) !important;
  line-height: 1.0 !important;
}

.biz-contact-title {
  max-width: 1120px;
  font-size: clamp(54px, 7vw, 112px) !important;
  line-height: .94 !important;
}

/* Give the right column a little more room where copy was pinching headings */
@media (min-width: 1180px){
  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid{
    grid-template-columns: 1.12fr .88fr;
    gap: clamp(70px, 8vw, 130px);
  }

  .business-service-head{
    grid-template-columns: 1.1fr .9fr;
    gap: clamp(70px, 8vw, 130px);
  }
}

/* Tablet: preserve phrase boundaries, reduce size before letting phrases wrap */
@media (max-width: 1179px) and (min-width: 768px){
  .business-hero h1{
    font-size: clamp(54px, 7vw, 76px);
  }

  .biz-challenge-title,
  .biz-product-title,
  .biz-start-title,
  .biz-faq-title{
    font-size: clamp(40px, 5.4vw, 62px) !important;
  }

  .biz-value-title,
  .biz-service-title,
  .biz-flow-title{
    font-size: clamp(44px, 5.8vw, 68px) !important;
  }

  .biz-contact-title{
    font-size: clamp(50px, 7vw, 82px) !important;
  }
}

/* Mobile: each span is one intended line group; font size chosen to avoid ugly one-word wraps */
@media (max-width: 767px){
  .business-hero h1{
    max-width: 100%;
    font-size: clamp(42px, 11.5vw, 58px);
    line-height: .96;
  }

  .biz-challenge-title,
  .biz-value-title,
  .biz-product-title,
  .biz-service-title,
  .biz-flow-title,
  .biz-start-title,
  .biz-faq-title{
    max-width: 100%;
    font-size: clamp(38px, 10.6vw, 52px) !important;
    line-height: 1.04 !important;
  }

  .biz-contact-title{
    max-width: 100%;
    font-size: clamp(46px, 12vw, 64px) !important;
    line-height: .98 !important;
  }

  .business-product-copy li{
    word-break: normal;
    line-break: strict;
  }

  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid,
  .business-service-head{
    gap: 34px !important;
  }
}


/* ===== Ver.8 SERVICE PAGE ===== */
.service-hero{background:#f7f7f7}
.service-hero h1{
  display:inline-block;
  max-width:900px;
  padding:18px 22px 22px;
  background:#050505;color:#fff;
  font-size:clamp(60px,6.8vw,100px);
  line-height:.92;letter-spacing:-.075em;
  word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.service-hero h1 span{display:block}

.service-overview-grid,.service-analysis-grid,.service-flex-grid{
  display:grid;grid-template-columns:1.08fr .92fr;
  gap:clamp(60px,9vw,140px);align-items:start;
}
.service-title,.service-map-title,.analysis-title,.flex-title,.service-contact-title{
  margin:0;word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.service-title span,.service-map-title span,.analysis-title span,.flex-title span,.service-contact-title span{display:block}
.service-title{max-width:820px;font-size:clamp(46px,5.5vw,82px);line-height:.98;letter-spacing:-.055em}
.service-overview-grid>div:last-child p{margin:0 0 22px;font-size:clamp(15px,1.2vw,19px);line-height:1.95}

.service-map{background:#050505;color:#fff}
.service-map-title{max-width:980px;font-size:clamp(50px,6.3vw,96px);line-height:.96;letter-spacing:-.06em}
.service-map-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(65px,8vw,115px);background:#333;border:1px solid #333}
.service-map-grid article{min-height:300px;padding:28px 24px;background:#050505}
.service-map-grid article>span{color:var(--pink);font-size:11px;font-weight:900}
.service-map-grid h3{margin:58px 0 8px;color:#aaa;font-size:12px;letter-spacing:.12em}
.service-map-grid strong{display:block;margin-bottom:16px;font-size:24px}
.service-map-grid p{margin:0;color:#c7c7c7;font-size:14px;line-height:1.82}

.service-detail{background:#fff}
.detail-block{display:grid;grid-template-columns:80px .9fr 1.1fr;gap:clamp(30px,5vw,80px);padding:58px 0;border-top:1px solid #ccc;align-items:start}
.detail-block:last-child{border-bottom:1px solid #ccc}
.detail-num{color:var(--pink);font-size:12px;font-weight:900}
.detail-title p{margin:0 0 14px;color:#777;font-size:11px;font-weight:900;letter-spacing:.14em}
.detail-title h2{margin:0;font-size:clamp(40px,4.8vw,72px);line-height:1;letter-spacing:-.05em;word-break:keep-all;line-break:strict}
.detail-title h2 span{display:block}
.detail-copy p{margin:0 0 26px;font-size:15px;line-height:1.9}
.detail-copy ul{list-style:none;margin:0;padding:0;border-top:1px solid #ccc}
.detail-copy li{padding:15px 0;border-bottom:1px solid #ccc;font-weight:800;font-size:14px}

.service-analysis{background:#050505;color:#fff}
.analysis-title{max-width:850px;font-size:clamp(48px,5.8vw,88px);line-height:.98;letter-spacing:-.06em}
.service-analysis-grid>div:last-child>p{margin:0 0 34px;color:#ccc;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.analysis-list{border-top:1px solid #333}
.analysis-list>div{display:flex;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid #333}
.analysis-list span{color:var(--pink);font-size:11px;font-weight:900}
.analysis-list strong{font-size:17px}

.service-flex{background:#f7f7f7}
.flex-title{max-width:800px;font-size:clamp(48px,5.8vw,88px);line-height:.98;letter-spacing:-.06em}
.service-flex-grid>div:last-child>p{margin:0 0 34px;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.flex-tags{display:flex;flex-wrap:wrap;gap:10px}
.flex-tags span{padding:12px 18px;border:1.5px solid #050505;border-radius:999px;font-size:12px;font-weight:900}

.service-contact{background:var(--pink);color:#fff}
.service-contact-title{max-width:1120px;font-size:clamp(54px,7vw,112px);line-height:.94;letter-spacing:-.07em}
.service-contact-title em{color:#050505}
.service-contact-lead{max-width:760px;margin:35px 0 0;font-size:clamp(15px,1.2vw,18px);line-height:1.9}

@media(max-width:1000px){
  .service-map-grid{grid-template-columns:repeat(2,1fr)}
  .detail-block{grid-template-columns:60px 1fr}
  .detail-copy{grid-column:2}
}
@media(max-width:767px){
  .service-hero h1{max-width:100%;padding:14px 14px 16px;font-size:clamp(42px,11.5vw,58px);line-height:.96}
  .service-overview-grid,.service-analysis-grid,.service-flex-grid{grid-template-columns:1fr;gap:36px}
  .service-title,.service-map-title,.analysis-title,.flex-title{
    max-width:100%;
    font-size:clamp(38px,10.6vw,52px);
    line-height:1.04;
  }
  .service-map-grid{grid-template-columns:1fr}
  .service-map-grid article{min-height:220px}
  .service-map-grid h3{margin-top:38px}
  .detail-block{grid-template-columns:1fr;gap:18px;padding:42px 0}
  .detail-copy{grid-column:auto}
  .detail-title h2{font-size:clamp(38px,10.8vw,52px);line-height:1.02}
  .service-contact-title{max-width:100%;font-size:clamp(46px,12vw,64px);line-height:.98}
}


/* ===== Ver.9 FAQ PAGE ===== */
.faq-hero{background:#f7f7f7}
.faq-hero h1{
  display:inline-block;
  max-width:920px;
  padding:18px 22px 22px;
  background:#050505;color:#fff;
  font-size:clamp(60px,6.8vw,100px);
  line-height:.92;letter-spacing:-.075em;
  word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.faq-hero h1 span{display:block}

.faq-index{background:#fff}
.faq-index-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.faq-index-grid a{position:relative;min-height:240px;padding:30px;background:#f5f5f5;display:flex;flex-direction:column;justify-content:space-between;transition:.25s}
.faq-index-grid a:hover{background:#050505;color:#fff;transform:translateY(-6px)}
.faq-index-grid a>span{color:var(--pink);font-size:11px;font-weight:900;letter-spacing:.14em}
.faq-index-grid strong{max-width:500px;font-size:clamp(24px,2.8vw,42px);line-height:1.3;word-break:keep-all}
.faq-index-grid b{position:absolute;right:28px;bottom:24px;font-size:30px}

.faq-detail{background:#050505;color:#fff}
.business-faq-section{background:#fff;color:#050505}
.faq-detail-head{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(55px,10vw,150px);align-items:end}
.faq-detail-head h2{margin:0;word-break:keep-all;overflow-wrap:normal;line-break:strict}
.faq-detail-head h2 span{display:block}
.faq-creator-title,.faq-business-title{
  max-width:820px;
  font-size:clamp(48px,5.8vw,88px);
  line-height:.98;letter-spacing:-.06em;
}
.faq-detail-head>p{margin:0;color:#c8c8c8;font-size:clamp(15px,1.2vw,18px);line-height:1.95}
.business-faq-section .faq-detail-head>p{color:#555}

.faq-list{margin-top:clamp(60px,8vw,110px);border-top:1px solid #333}
.business-faq-section .faq-list{border-top-color:#ccc}
.faq-list details{border-bottom:1px solid #333}
.business-faq-section .faq-list details{border-bottom-color:#ccc}
.faq-list summary{
  list-style:none;position:relative;display:grid;grid-template-columns:70px 1fr;
  gap:18px;align-items:start;padding:25px 48px 25px 0;cursor:pointer;
  font-size:clamp(15px,1.25vw,18px);font-weight:800;line-height:1.6;
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary span{color:var(--pink);font-size:11px;font-weight:900;padding-top:.35em}
.faq-list summary:before,.faq-list summary:after{
  content:"";position:absolute;right:6px;top:34px;width:18px;height:2px;background:#fff;transition:.2s;
}
.business-faq-section .faq-list summary:before,.business-faq-section .faq-list summary:after{background:#050505}
.faq-list summary:after{transform:rotate(90deg)}
.faq-list details[open] summary:after{transform:none}
.faq-list details[open] summary:before,.faq-list details[open] summary:after{background:var(--pink)}
.faq-list details p{
  max-width:980px;margin:0;padding:0 48px 28px 88px;color:#c8c8c8;font-size:14px;line-height:1.9;
}
.business-faq-section .faq-list details p{color:#555}

.faq-contact{background:var(--pink);color:#fff}
.faq-contact-title{
  max-width:1120px;margin:0;
  font-size:clamp(54px,7vw,112px);
  line-height:.94;letter-spacing:-.07em;
  word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.faq-contact-title span{display:block}
.faq-contact-title em{color:#050505}
.faq-contact-lead{max-width:760px;margin:35px 0 0;font-size:clamp(15px,1.2vw,18px);line-height:1.9}

@media(max-width:767px){
  .faq-hero h1{max-width:100%;padding:14px 14px 16px;font-size:clamp(42px,11.5vw,58px);line-height:.96}
  .faq-index-grid,.faq-detail-head{grid-template-columns:1fr;gap:36px}
  .faq-index-grid a{min-height:190px}
  .faq-creator-title,.faq-business-title{max-width:100%;font-size:clamp(38px,10.6vw,52px);line-height:1.04}
  .faq-list summary{grid-template-columns:48px 1fr;gap:12px;padding-right:38px}
  .faq-list summary:before,.faq-list summary:after{right:4px;top:31px;width:16px}
  .faq-list details p{padding-left:60px;padding-right:20px}
  .faq-contact-title{max-width:100%;font-size:clamp(46px,12vw,64px);line-height:.98}
}


/* ===== Ver.10 COMPANY PAGE ===== */
.company-hero{background:#f7f7f7}
.company-hero h1{
  display:inline-block;
  max-width:980px;
  padding:18px 22px 22px;
  background:#050505;color:#fff;
  font-size:clamp(60px,6.8vw,100px);
  line-height:.92;letter-spacing:-.075em;
  word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.company-hero h1 span{display:block}

.company-message-grid,
.company-profile-grid,
.company-policy-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(60px,9vw,140px);
  align-items:start;
}

.company-message-title,
.company-profile-title,
.company-business-title,
.company-policy-title,
.company-contact-title{
  margin:0;
  word-break:keep-all;
  overflow-wrap:normal;
  line-break:strict;
}
.company-message-title span,
.company-profile-title span,
.company-business-title span,
.company-policy-title span,
.company-contact-title span{display:block}

.company-message-title{
  max-width:760px;
  font-size:clamp(46px,5.5vw,82px);
  line-height:.98;letter-spacing:-.055em;
}
.company-message-grid>div:last-child p{
  margin:0 0 22px;
  font-size:clamp(15px,1.2vw,19px);
  line-height:1.95;
}

.company-profile{background:#050505;color:#fff}
.company-profile-title{
  max-width:650px;
  font-size:clamp(48px,5.8vw,88px);
  line-height:.98;letter-spacing:-.06em;
}
.company-table{margin:0;border-top:1px solid #333}
.company-table>div{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:28px;
  padding:24px 0;
  border-bottom:1px solid #333;
}
.company-table dt{
  color:var(--pink);
  font-size:12px;
  font-weight:900;
}
.company-table dd{
  margin:0;
  color:#ddd;
  font-size:15px;
  line-height:1.85;
}

.company-business{background:#fff}
.company-business-title{
  max-width:1080px;
  font-size:clamp(50px,6.2vw,96px);
  line-height:.96;letter-spacing:-.06em;
}
.company-business-cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:clamp(60px,8vw,110px);
}
.company-business-cards article{
  min-height:400px;
  padding:34px;
  background:#f5f5f5;
  display:flex;
  flex-direction:column;
}
.company-business-num{
  color:var(--pink);
  font-size:11px;
  font-weight:900;
}
.company-business-en{
  margin:70px 0 8px;
  color:#777;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
}
.company-business-cards h3{
  margin:0 0 18px;
  font-size:clamp(34px,4vw,62px);
  letter-spacing:-.04em;
}
.company-business-cards article>p:not(.company-business-en){
  max-width:600px;
  margin:0;
  color:#555;
  font-size:15px;
  line-height:1.9;
}
.company-business-cards a{
  margin-top:auto;
  padding-top:28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-top:1px solid #bbb;
  font-weight:900;
}
.company-business-cards a span{
  color:var(--pink);
  font-size:24px;
}

.company-policy{background:#050505;color:#fff}
.company-policy-title{
  max-width:800px;
  font-size:clamp(48px,5.8vw,88px);
  line-height:.98;letter-spacing:-.06em;
}
.company-policy-grid>div:last-child p{
  margin:0 0 18px;
  color:#ccc;
  font-size:clamp(17px,1.5vw,23px);
  line-height:1.75;
  font-weight:700;
}

.company-contact{background:var(--pink);color:#fff}
.company-contact-title{
  max-width:1120px;
  font-size:clamp(54px,7vw,112px);
  line-height:.94;letter-spacing:-.07em;
}
.company-contact-title em{color:#050505}
.company-contact-lead{
  max-width:760px;
  margin:35px 0 0;
  font-size:clamp(15px,1.2vw,18px);
  line-height:1.9;
}

@media(max-width:767px){
  .company-hero h1{
    max-width:100%;
    padding:14px 14px 16px;
    font-size:clamp(42px,11.5vw,58px);
    line-height:.96;
  }

  .company-message-grid,
  .company-profile-grid,
  .company-policy-grid{
    grid-template-columns:1fr;
    gap:36px;
  }

  .company-message-title,
  .company-profile-title,
  .company-business-title,
  .company-policy-title{
    max-width:100%;
    font-size:clamp(38px,10.6vw,52px);
    line-height:1.04;
  }

  .company-table>div{
    grid-template-columns:1fr;
    gap:8px;
  }

  .company-business-cards{
    grid-template-columns:1fr;
  }

  .company-business-cards article{
    min-height:320px;
    padding:26px;
  }

  .company-business-en{margin-top:48px}

  .company-contact-title{
    max-width:100%;
    font-size:clamp(46px,12vw,64px);
    line-height:.98;
  }
}


/* ===== Ver.11 CONTACT PAGE ===== */
.contact-hero{background:#f7f7f7}
.contact-hero h1{
  display:inline-block;max-width:980px;padding:18px 22px 22px;
  background:#050505;color:#fff;
  font-size:clamp(60px,6.8vw,100px);line-height:.92;letter-spacing:-.075em;
  word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.contact-hero h1 span{display:block}

.contact-route-title,
.contact-form-title,
.contact-note-title{
  margin:0;word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.contact-route-title span,
.contact-form-title span,
.contact-note-title span{display:block}
.contact-route-title{max-width:920px;font-size:clamp(50px,6.2vw,96px);line-height:.96;letter-spacing:-.06em}
.contact-route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:clamp(60px,8vw,110px)}
.route-card{position:relative;min-height:320px;padding:30px;background:#f5f5f5;display:flex;flex-direction:column;justify-content:space-between;transition:.25s}
.route-card:hover{background:#050505;color:#fff;transform:translateY(-6px)}
.route-num{color:var(--pink);font-size:11px;font-weight:900}
.route-card small{display:block;margin-bottom:12px;color:var(--pink);font-size:11px;font-weight:900;letter-spacing:.13em}
.route-card strong{display:block;font-size:clamp(24px,2.3vw,36px);line-height:1.28;word-break:keep-all}
.route-card p{max-width:420px;margin:14px 0 0;color:#666;font-size:14px;line-height:1.8}
.route-card:hover p{color:#ccc}
.route-card b{position:absolute;right:28px;bottom:25px;font-size:30px}

.contact-form-section{background:#050505;color:#fff}
.business-contact-form{background:#fff;color:#050505}
.contact-form-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(55px,9vw,140px);align-items:start}
.contact-form-intro .label{margin-bottom:18px}
.contact-form-title{max-width:720px;font-size:clamp(46px,5.4vw,82px);line-height:.98;letter-spacing:-.055em}
.contact-form-intro>p:last-child{max-width:560px;margin:30px 0 0;color:#ccc;font-size:15px;line-height:1.9}
.business-contact-form .contact-form-intro>p:last-child{color:#555}

.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px}
.contact-form label{display:flex;flex-direction:column;gap:10px}
.contact-form label>span{font-size:12px;font-weight:800}
.contact-form label>span em{margin-left:8px;color:var(--pink);font-style:normal;font-size:10px}
.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%;border:1px solid #444;border-radius:0;background:#111;color:#fff;
  padding:15px 14px;font:inherit;font-size:14px;outline:none;transition:.2s
}
.business-contact-form .contact-form input,
.business-contact-form .contact-form select,
.business-contact-form .contact-form textarea{
  border-color:#ccc;background:#fff;color:#050505
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{border-color:var(--pink)}
.contact-form textarea{resize:vertical;line-height:1.7}
.contact-form .full{grid-column:1/-1}
.contact-form .check{flex-direction:row;align-items:center;gap:10px}
.contact-form .check input{width:18px;height:18px;accent-color:var(--pink)}
.contact-form .check span{font-size:12px;font-weight:500}
.form-submit{
  min-height:64px;border:0;background:var(--pink);color:#fff;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 22px;font-size:14px;font-weight:900;cursor:pointer;transition:.2s
}
.form-submit:hover{background:#fff;color:#050505;transform:translateY(-2px)}
.business-contact-form .form-submit:hover{background:#050505;color:#fff}

.contact-note{background:#f7f7f7}
.contact-note-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(55px,9vw,140px)}
.contact-note-title{max-width:700px;font-size:clamp(46px,5.4vw,82px);line-height:.98;letter-spacing:-.055em}
.contact-note-grid>div p{margin:0 0 18px;font-size:15px;line-height:1.9}

@media(max-width:900px){
  .contact-route-grid{grid-template-columns:1fr}
}
@media(max-width:767px){
  .contact-hero h1{max-width:100%;padding:14px 14px 16px;font-size:clamp(42px,11.5vw,58px);line-height:.96}
  .contact-route-title,.contact-form-title,.contact-note-title{
    max-width:100%;font-size:clamp(38px,10.6vw,52px);line-height:1.04
  }
  .route-card{min-height:220px;padding:25px}
  .contact-form-layout,.contact-note-grid{grid-template-columns:1fr;gap:38px}
  .contact-form{grid-template-columns:1fr}
  .contact-form .full{grid-column:auto}
}


/* ===== Ver.12 LEGAL PAGES ===== */
.legal-hero{background:#f7f7f7}
.legal-hero h1{
  display:inline-block;
  max-width:1040px;
  padding:18px 22px 22px;
  background:#050505;color:#fff;
  font-size:clamp(58px,6.5vw,96px);
  line-height:.94;letter-spacing:-.07em;
  word-break:keep-all;overflow-wrap:normal;line-break:strict;
}
.legal-hero h1 span{display:block}

.legal-content{background:#fff}
.legal-layout{
  display:grid;
  grid-template-columns:260px 1fr;
  gap:clamp(50px,8vw,120px);
  align-items:start;
}
.legal-index{
  position:sticky;
  top:110px;
  display:flex;
  flex-direction:column;
  border-top:1px solid #ccc;
}
.legal-index a{
  padding:13px 0;
  border-bottom:1px solid #ccc;
  font-size:12px;
  font-weight:800;
  line-height:1.5;
}
.legal-index a:hover{color:var(--pink)}

.legal-body{
  max-width:920px;
}
.legal-body>section{
  padding:0 0 58px;
  margin:0 0 58px;
  border-bottom:1px solid #ddd;
  scroll-margin-top:110px;
}
.legal-body>section:last-child{margin-bottom:0}
.legal-body h2{
  margin:0 0 26px;
  font-size:clamp(25px,2.6vw,38px);
  line-height:1.35;
  letter-spacing:-.025em;
  word-break:keep-all;
  line-break:strict;
}
.legal-body h2 span{
  color:var(--pink);
  margin-right:8px;
}
.legal-body p{
  margin:0 0 18px;
  font-size:15px;
  line-height:2;
}
.legal-body ul{
  margin:18px 0 0;
  padding-left:1.4em;
}
.legal-body li{
  margin:8px 0;
  font-size:15px;
  line-height:1.85;
}
.legal-company{
  margin-top:30px;
  padding:26px;
  background:#f5f5f5;
}
.legal-company strong{
  display:block;
  margin-bottom:12px;
  font-size:18px;
}
.legal-company p{
  margin:0;
  font-size:14px;
  line-height:1.8;
}

@media(max-width:767px){
  .legal-hero h1{
    max-width:100%;
    padding:14px 14px 16px;
    font-size:clamp(40px,10.8vw,56px);
    line-height:.98;
  }
  .legal-layout{
    grid-template-columns:1fr;
    gap:46px;
  }
  .legal-index{
    position:static;
  }
  .legal-body>section{
    padding-bottom:42px;
    margin-bottom:42px;
  }
  .legal-body h2{
    font-size:clamp(23px,7vw,32px);
  }
}


/* ==========================================================
   PUBLIC CANDIDATE — FINAL TYPOGRAPHY / BREAK RULES
   Japanese headings are broken by semantic phrase, not by glyph.
   ========================================================== */

:root{
  --content-max: 1440px;
}

/* Prevent accidental mid-word / mid-phrase breaks on headline spans. */
.hero h1 > span,
.sub-hero h1 > span,
.section h2 > span,
.contact-head h2 > span,
.contact-form-title > span,
.company-contact-title > span,
.faq-contact-title > span,
.service-contact-title > span,
.creator-contact h2 > span,
.business-contact h2 > span,
.about-final h2 > span{
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
}

/* Long body copy remains naturally readable. */
.section p,
.legal-body p,
.legal-body li,
.faq-list summary,
.faq-list details p{
  line-break: strict;
  overflow-wrap: break-word;
}

/* Global editorial width: avoids overly long lines on wide monitors. */
.section{
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
}
.about-copy,
.creator-intro,
.business-copy,
.creator-definition-copy,
.business-product-copy,
.contact-form-intro,
.legal-body{
  text-wrap: pretty;
}

/* Hero copy: keep deliberate 2-line phrases on desktop. */
@media (min-width: 1200px){
  .hero h1,
  .sub-hero h1{
    text-wrap: balance;
  }

  .about-hero h1{
    font-size: clamp(58px, 6.5vw, 96px);
    line-height: .92;
  }

  .creator-hero h1,
  .business-hero h1,
  .service-hero h1,
  .faq-hero h1,
  .company-hero h1,
  .contact-hero h1,
  .legal-hero h1{
    line-height: .94;
  }
}

/* Tablet: reduce headings before letting semantic phrases wrap. */
@media (max-width:1199px) and (min-width:768px){
  .sub-hero h1{
    font-size: clamp(50px, 7.2vw, 78px) !important;
  }
  .section h2{
    line-height: 1.02;
  }
}

/* Mobile: readable, deliberate lines; no oversized orphaned word. */
@media (max-width:767px){
  .sub-hero h1{
    font-size: clamp(40px, 10.8vw, 56px) !important;
    line-height: .98 !important;
  }
  .section h2{
    line-height: 1.05;
  }
  .hero h1 > span,
  .sub-hero h1 > span,
  .section h2 > span{
    max-width: 100%;
  }
}

/* Buttons and cards: avoid awkward Japanese wraps. */
.btn,
.round-cta,
.route-card strong,
.contact-card strong,
.company-business-cards h3{
  word-break: keep-all;
  line-break: strict;
}

/* Slightly calmer hover motion for public release. */
.support-grid article:hover,
.support-detail-grid article:hover,
.route-card:hover,
.contact-card:hover,
.btn:hover{
  transform: translateY(-4px);
}

/* Forms: clear placeholder state until backend is connected. */
.contact-form[data-preview-form="true"] .form-submit::after{
  content: "";
}


/* ==========================================================
   PUBLIC CANDIDATE v2 — VERTICAL SPACING / OVERLAP FIX
   ========================================================== */
.hero .en,
.hero h1,
.sub-hero h1,
.section h2,
.mega,
.creator-message,
.contact-head h2,
.contact-form-title,
.company-contact-title,
.faq-contact-title,
.service-contact-title,
.creator-contact h2,
.business-contact h2,
.about-final h2 { line-height: 1.04 !important; }
.hero .en { line-height: .94 !important; }
.sub-hero h1 + .sub-lead { margin-top: 34px !important; }
.section h2 + p,
.section h2 + .lead-strong { margin-top: 28px; }
.section-kicker { margin-bottom: clamp(48px, 5.5vw, 82px) !important; }
.section p,
.legal-body p,
.faq-list details p,
.contact-form-intro > p,
.company-message-grid > div:last-child p,
.business-challenge-grid > div:last-child p,
.creator-definition-copy p { line-height: 1.9; }
.section p + p,
.legal-body p + p { margin-top: 16px; }
.support-grid h3,
.support-detail-grid h3,
.business-values strong,
.business-value-grid strong,
.service-list h3,
.service-map-grid h3,
.business-service-grid h3,
.flow-grid h3,
.business-flow-grid h3,
.reward-cards h3,
.fit-grid strong,
.values-grid strong,
.stage-list strong,
.company-business-cards h3 { line-height: 1.4 !important; margin-bottom: 18px !important; }
.support-grid p,
.support-detail-grid p,
.business-values p,
.business-value-grid p,
.service-list p,
.service-map-grid p,
.business-service-grid p,
.flow-grid p,
.business-flow-grid p,
.reward-cards p,
.fit-grid p,
.values-grid p,
.stage-list p,
.company-business-cards p { line-height: 1.85 !important; }
.about-copy h2,
.possibility-head h2,
.creator-top h2,
.business-head h2,
.service-head h2,
.product h2,
.commerce-head h2,
.creator-definition h2,
.creator-support-head h2,
.creator-choice h2,
.creator-reward h2,
.creator-flow-head h2,
.creator-faq h2,
.business-challenge h2,
.business-product h2,
.business-flow-head h2,
.business-start h2,
.business-faq h2,
.company-message-title,
.company-profile-title,
.company-business-title,
.company-policy-title,
.contact-route-title,
.contact-form-title,
.contact-note-title,
.service-title,
.service-map-title,
.analysis-title,
.flex-title,
.faq-creator-title,
.faq-business-title { padding-bottom: .08em; }
.btn,.round-cta,.form-submit,.neo-link { line-height: 1.4; }
.faq summary,.faq-list summary,.creator-faq summary,.business-faq summary { line-height: 1.75 !important; }
.legal-body h2 { line-height: 1.45 !important; margin-bottom: 30px !important; }
.company-table dd { line-height: 1.9 !important; }
@media (max-width: 767px) {
  .hero .en { line-height: .96 !important; }
  .hero h1,.sub-hero h1,.section h2,.mega,.creator-message,.contact-head h2,.contact-form-title,.company-contact-title,.faq-contact-title,.service-contact-title,.creator-contact h2,.business-contact h2,.about-final h2 { line-height: 1.1 !important; }
  .sub-hero h1 + .sub-lead { margin-top: 28px !important; }
  .section-kicker { margin-bottom: 40px !important; }
  .section h2 + p,.section h2 + .lead-strong { margin-top: 24px; }
}
@media (min-width: 1200px) {
  .mega,.possibility-head h2,.creator-top h2,.business-head h2,.service-head h2,.commerce-head h2,.contact-head h2,.about-final h2,.creator-contact h2,.business-contact h2 { line-height: 1.02 !important; }
}


/* ===== Final content review — spacing, matrix, footer ===== */
.about-copy p,
.possibility-grid p,
.creator-intro p,
.support-grid p,
.product-copy p,
.matrix-note p {
  white-space: pre-line;
}

.mega > span + span,
.possibility-head h2 > span + span,
.creator-top h2 > span + span,
.business-head h2 > span + span,
.service-head h2 > span + span,
.neo h2 > span + span,
.contact-head h2 > span + span {
  margin-top: .18em;
}

.matrix-note > strong { display:block; margin-bottom:24px; }
.matrix-note p { margin:18px 0 0; line-height:1.85; }
.matrix-points {
  list-style:none; margin:28px 0; padding:0;
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;
}
.matrix-points li {
  min-height:62px; padding:14px 16px; display:flex; align-items:center;
  background:#f3f3f3; border-left:3px solid var(--pink);
  font-size:13px; font-weight:800; line-height:1.45;
}

.neo-style-footer .footer-top {
  display:grid;
  grid-template-columns:minmax(300px,.85fr) minmax(420px,1.15fr);
  gap:clamp(50px,8vw,130px);
  align-items:start;
  padding-bottom:0;
}
.neo-style-footer .footer-left { max-width:420px; }
.neo-style-footer .footer-left picture,
.neo-style-footer .footer-left img {
  display:block;
  width:min(330px,100%);
}
.neo-style-footer .footer-meta {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
  margin-top:24px;
}
.neo-style-footer .footer-meta strong { font-size:14px; letter-spacing:.12em; }
.neo-style-footer .footer-meta span { color:#aaa; font-size:12px; letter-spacing:.06em; }
.neo-style-footer .footer-meta small { margin-top:12px; color:#666; font-size:11px; }
.neo-style-footer .footer-right { min-width:0; }
.neo-style-footer .footer-nav { width:100%; }

@media(max-width:900px){
  .matrix-points { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .neo-style-footer .footer-top { grid-template-columns:1fr; gap:52px; }
}
@media(max-width:767px){
  .matrix-points { grid-template-columns:1fr; }
  .mega > span + span,
  .possibility-head h2 > span + span,
  .creator-top h2 > span + span,
  .business-head h2 > span + span,
  .service-head h2 > span + span,
  .neo h2 > span + span,
  .contact-head h2 > span + span { margin-top:.22em; }
  .neo-style-footer .footer-left picture,
  .neo-style-footer .footer-left img { width:min(270px,100%); }
}


/* ==========================================================
   FINAL LINE-BREAK SYSTEM
   ========================================================== */

/* Meaning-unit spans */
.hero h1 > span,
.sub-hero h1 > span,
.section h2 > span,
.mega > span,
.headline > span {
  display:block;
}

/* Desktop/tablet: semantic lines stay intact */
@media (min-width: 768px) {
  .hero h1 > span,
  .sub-hero h1 > span,
  .section h2 > span,
  .mega > span,
  .headline > span {
    white-space: nowrap;
  }
}

/* Mobile: allow only necessary wrapping inside each semantic line */
@media (max-width: 767px) {
  .hero h1 > span,
  .sub-hero h1 > span,
  .section h2 > span,
  .mega > span,
  .headline > span {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
    line-break: strict;
  }
}

/* Safer type sizes to avoid accidental third/fourth lines */
.mega { font-size: clamp(52px, 6.7vw, 104px) !important; line-height: 1.03 !important; }
.possibility-head h2 { font-size: clamp(44px, 5.4vw, 84px) !important; line-height: 1.05 !important; }
.creator-top h2,
.business-head h2 { font-size: clamp(48px, 5.9vw, 92px) !important; line-height: 1.04 !important; }
.service-head h2,
.product h2,
.commerce-head h2 { font-size: clamp(46px, 5.5vw, 86px) !important; line-height: 1.04 !important; }
.sub-hero h1 { line-height: 1.02 !important; }

/* Explicit breathing room between intended lines */
.mega > span + span,
.headline > span + span,
.possibility-head h2 > span + span,
.creator-top h2 > span + span,
.business-head h2 > span + span,
.service-head h2 > span + span,
.product h2 > span + span,
.commerce-head h2 > span + span,
.neo h2 > span + span,
.contact-head h2 > span + span {
  margin-top: .18em;
}

/* Preserve reviewed paragraph breaks */
.about-copy p,
.possibility-grid p,
.creator-intro p,
.support-grid p,
.product-copy p,
.matrix-note p {
  white-space: pre-line;
}

/* Product Analysis Matrix */
.matrix-note > strong { display:block; margin-bottom:24px; }
.matrix-note p { margin:18px 0 0; line-height:1.85; }
.matrix-points {
  list-style:none; margin:28px 0; padding:0;
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;
}
.matrix-points li {
  min-height:62px; display:flex; align-items:center;
  padding:14px 16px; background:#f3f3f3;
  border-left:3px solid var(--pink);
  font-size:13px; font-weight:800; line-height:1.45;
}

@media (max-width: 900px) {
  .matrix-points { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 767px) {
  .mega { font-size: clamp(44px, 13vw, 62px) !important; }
  .possibility-head h2,
  .creator-top h2,
  .business-head h2,
  .service-head h2,
  .product h2,
  .commerce-head h2,
  .section h2 {
    font-size: clamp(36px, 10.2vw, 50px) !important;
    line-height: 1.08 !important;
  }
  .sub-hero h1 {
    font-size: clamp(38px, 10.5vw, 54px) !important;
    line-height: 1.06 !important;
  }
  .matrix-points { grid-template-columns:1fr; }
}


/* ==========================================================
   DISPLAY REVIEW FIX — based on full-page screenshot
   ========================================================== */

/* Every grid child may shrink without invading the next column */
.about-grid > *,
.possibility-head > *,
.creator-top > *,
.business-head > *,
.service-head > *,
.product-grid > *,
.commerce-head > *,
.neo-grid > *,
.contact-head > *,
.faq-head > * {
  min-width: 0;
}

/* TOP / ABOUT: more separation between oversized heading and body */
.about-grid {
  grid-template-columns: minmax(0, 1.02fr) minmax(340px, .98fr) !important;
  gap: clamp(72px, 9vw, 150px) !important;
}
.about-grid .mega {
  max-width: 680px;
  font-size: clamp(52px, 5.9vw, 94px) !important;
  line-height: 1.06 !important;
}
.about-copy {
  max-width: 620px;
  padding-left: clamp(0px, 1.2vw, 22px);
}
.about-copy h2 {
  font-size: clamp(36px, 3.8vw, 58px) !important;
  line-height: 1.12 !important;
  margin-bottom: 34px !important;
}

/* NEW POSSIBILITY: prevent the long title from dominating the section */
.possibility-head {
  grid-template-columns: minmax(170px,.42fr) minmax(0,1.58fr) !important;
  gap: clamp(50px, 7vw, 110px) !important;
  align-items:start;
}
.possibility-head h2 {
  max-width: 930px;
  font-size: clamp(42px, 5vw, 78px) !important;
  line-height: 1.06 !important;
}

/* Creator / Business: copy and headline should have their own clear territory */
.creator-top,
.business-head {
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr) !important;
  gap: clamp(70px, 9vw, 145px) !important;
}
.creator-top h2,
.business-head h2 {
  max-width: 760px;
  font-size: clamp(46px, 5.25vw, 82px) !important;
  line-height: 1.06 !important;
}
.creator-intro,
.business-copy {
  max-width: 600px;
}

/* Service: stronger separation */
.service-head {
  grid-template-columns: minmax(0, 1.05fr) minmax(350px,.95fr) !important;
  gap: clamp(70px, 9vw, 145px) !important;
}
.service-head h2 {
  max-width: 760px;
  font-size: clamp(46px, 5.2vw, 82px) !important;
  line-height: 1.06 !important;
}

/* Product section: give analysis copy more readable width */
.product-grid {
  grid-template-columns: minmax(0, 1.02fr) minmax(390px, .98fr) !important;
  gap: clamp(70px, 8vw, 130px) !important;
}
.product h2 {
  max-width: 800px;
  font-size: clamp(44px, 5vw, 78px) !important;
  line-height: 1.07 !important;
}
.product-copy {
  max-width: 650px;
}

/* Matrix should feel like a visible analysis tool, not tiny fine print */
.matrix-note {
  margin-top: clamp(64px, 7vw, 100px) !important;
  padding: clamp(34px, 4vw, 56px) !important;
}
.matrix-note > strong {
  font-size: clamp(24px, 2.4vw, 38px) !important;
  line-height: 1.2;
}
.matrix-points {
  grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
  gap: 12px !important;
}
.matrix-points li {
  min-height: 72px !important;
  padding: 16px 18px !important;
  font-size: 14px !important;
}

/* LIVE COMMERCE title: controlled width */
.commerce-head h2 {
  max-width: 1120px !important;
  font-size: clamp(44px, 5.4vw, 84px) !important;
  line-height: 1.06 !important;
}

/* FAQ heading / copy */
.faq-head {
  grid-template-columns: minmax(0,1fr) minmax(340px,.72fr) !important;
  gap: clamp(70px, 8vw, 130px) !important;
}
.faq-head h2 {
  font-size: clamp(48px, 5.4vw, 82px) !important;
  line-height: 1.06 !important;
}

/* NEO STREAM */
.neo-grid {
  grid-template-columns: minmax(0,1.05fr) minmax(340px,.95fr) !important;
  gap: clamp(70px, 9vw, 145px) !important;
}
.neo h2 {
  font-size: clamp(46px, 5.2vw, 82px) !important;
  line-height: 1.06 !important;
}

/* Contact title */
.contact-head h2 {
  max-width: 1000px;
  font-size: clamp(52px, 6.5vw, 102px) !important;
  line-height: 1.02 !important;
}

/* Extra vertical breathing room between semantic headline lines */
.mega > span + span,
.possibility-head h2 > span + span,
.creator-top h2 > span + span,
.business-head h2 > span + span,
.service-head h2 > span + span,
.product h2 > span + span,
.commerce-head h2 > span + span,
.neo h2 > span + span,
.contact-head h2 > span + span {
  margin-top: .22em !important;
}

/* Tablet: move to one column sooner instead of squeezing two columns */
@media (max-width: 1050px) {
  .about-grid,
  .creator-top,
  .business-head,
  .service-head,
  .product-grid,
  .faq-head,
  .neo-grid {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }

  .possibility-head {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  .about-grid .mega,
  .creator-top h2,
  .business-head h2,
  .service-head h2,
  .product h2,
  .faq-head h2,
  .neo h2 {
    max-width: 850px;
  }

  .matrix-points {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

/* Phone */
@media (max-width: 767px) {
  .about-grid,
  .creator-top,
  .business-head,
  .service-head,
  .product-grid,
  .faq-head,
  .neo-grid {
    gap: 34px !important;
  }

  .about-grid .mega {
    font-size: clamp(42px, 13vw, 60px) !important;
  }
  .about-copy h2,
  .creator-top h2,
  .business-head h2,
  .service-head h2,
  .product h2,
  .faq-head h2,
  .neo h2 {
    font-size: clamp(36px, 10.5vw, 50px) !important;
    line-height: 1.1 !important;
  }

  .possibility-head h2,
  .commerce-head h2 {
    font-size: clamp(36px, 10vw, 50px) !important;
    line-height: 1.1 !important;
  }

  .matrix-points {
    grid-template-columns: 1fr !important;
  }
}


/* ===== Headline collision fix v2 ===== */

/* About headline: force 3 clean lines */
.mega-connect {
  max-width: 620px !important;
  font-size: clamp(52px, 5.6vw, 88px) !important;
  line-height: 1.08 !important;
}
.mega-connect > span {
  display: block !important;
  white-space: nowrap !important;
}
.mega-connect > span + span {
  margin-top: .22em !important;
}

/* New possibility headline: force 3 clean semantic lines */
.headline-possibility {
  max-width: 880px !important;
  font-size: clamp(40px, 4.6vw, 70px) !important;
  line-height: 1.08 !important;
}
.headline-possibility > span {
  display: block !important;
  white-space: nowrap !important;
}
.headline-possibility > span + span {
  margin-top: .20em !important;
}

/* On narrower screens, allow wrapping rather than clipping */
@media (max-width: 1050px) {
  .mega-connect > span,
  .headline-possibility > span {
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    line-break: strict !important;
  }
}

@media (max-width: 767px) {
  .mega-connect {
    max-width: 100% !important;
    font-size: clamp(42px, 12vw, 58px) !important;
    line-height: 1.10 !important;
  }
  .headline-possibility {
    max-width: 100% !important;
    font-size: clamp(36px, 9.8vw, 48px) !important;
    line-height: 1.12 !important;
  }
  .mega-connect > span + span,
  .headline-possibility > span + span {
    margin-top: .18em !important;
  }
}


/* ==========================================================
   GLOBAL SAFE HEADLINE SYSTEM v3
   ========================================================== */

/* all intended line groups */
.safe-title > span,
.hero h1 > span,
.sub-hero h1 > span,
.mega-connect > span,
.headline-possibility > span,
.headline-product > span,
.headline-commerce > span {
  display:block !important;
  position:relative;
}

/* no visual collision between lines */
.safe-title,
.hero h1,
.sub-hero h1,
.mega-connect,
.headline-possibility,
.headline-product,
.headline-commerce {
  line-height:1.08 !important;
}

.safe-title > span + span,
.hero h1 > span + span,
.sub-hero h1 > span + span,
.mega-connect > span + span,
.headline-possibility > span + span,
.headline-product > span + span,
.headline-commerce > span + span {
  margin-top:.20em !important;
}

/* desktop: keep each semantic phrase on one line only when it fits */
@media (min-width:1200px){
  .safe-title > span,
  .hero h1 > span,
  .sub-hero h1 > span,
  .mega-connect > span,
  .headline-possibility > span,
  .headline-product > span,
  .headline-commerce > span {
    white-space:nowrap !important;
  }

  /* long sections get a safe maximum and smaller type */
  .company-business-title,
  .company-contact-title,
  .faq-business-title,
  .service-map-title,
  .contact-route-title {
    font-size:clamp(42px,4.7vw,74px) !important;
    max-width:900px !important;
  }

  .headline-product,
  .headline-commerce {
    font-size:clamp(40px,4.6vw,72px) !important;
    max-width:980px !important;
  }
}

/* tablet: one-column layouts before squeezing text */
@media (max-width:1199px){
  .safe-title > span,
  .hero h1 > span,
  .sub-hero h1 > span,
  .mega-connect > span,
  .headline-possibility > span,
  .headline-product > span,
  .headline-commerce > span {
    white-space:normal !important;
    word-break:keep-all !important;
    overflow-wrap:normal !important;
    line-break:strict !important;
  }
}

/* mobile: slightly more line-height */
@media (max-width:767px){
  .safe-title,
  .hero h1,
  .sub-hero h1,
  .mega-connect,
  .headline-possibility,
  .headline-product,
  .headline-commerce {
    line-height:1.12 !important;
  }

  .safe-title > span + span,
  .hero h1 > span + span,
  .sub-hero h1 > span + span,
  .mega-connect > span + span,
  .headline-possibility > span + span,
  .headline-product > span + span,
  .headline-commerce > span + span {
    margin-top:.16em !important;
  }
}

/* Grid safety across all lower pages */
.about-intro-grid > *,
.definition-grid > *,
.choice-grid > *,
.relation-grid > *,
.creator-definition-grid > *,
.creator-fit-head > *,
.creator-support-head > *,
.creator-choice-grid > *,
.creator-reward-grid > *,
.creator-faq-grid > *,
.business-challenge-grid > *,
.business-product-grid > *,
.business-start-grid > *,
.business-faq-grid > *,
.business-service-head > *,
.service-overview-grid > *,
.service-analysis-grid > *,
.service-flex-grid > *,
.faq-detail-head > *,
.company-message-grid > *,
.company-profile-grid > *,
.company-policy-grid > *,
.contact-form-layout > *,
.contact-note-grid > * {
  min-width:0;
}


/* ==========================================================
   DISPLAY FIX v4 — screenshot-driven
   ========================================================== */

/* Hero: prevent fixed header from sitting inside CREATE / NEW / POSSIBILITIES */
@media (min-width: 768px) {
  .hero {
    min-height: 860px !important;
  }
  .hero-copy {
    top: 57% !important;
    transform: translateY(-45%) !important;
  }
  .hero-en {
    font-size: clamp(54px, 5.8vw, 104px) !important;
    line-height: .88 !important;
  }
}

/* Safer title system: never allow title to visually invade adjacent column */
.safe-title,
.headline-product,
.headline-commerce,
.headline-possibility {
  max-width: 100% !important;
}
.safe-title > span,
.headline-product > span,
.headline-commerce > span,
.headline-possibility > span {
  display: block !important;
}

/* TOP section columns */
.about-grid,
.creator-top,
.business-head,
.service-head,
.product-grid,
.faq-head,
.neo-grid {
  align-items: start !important;
}
.about-grid > *,
.creator-top > *,
.business-head > *,
.service-head > *,
.product-grid > *,
.faq-head > *,
.neo-grid > * {
  min-width: 0 !important;
}

/* ABOUT */
.about-grid {
  grid-template-columns: minmax(0, 1fr) minmax(380px, .82fr) !important;
  gap: clamp(80px, 9vw, 150px) !important;
}
.mega-connect {
  max-width: 620px !important;
  font-size: clamp(50px, 5.4vw, 84px) !important;
}
.top-about-copy-title {
  font-size: clamp(34px, 3.5vw, 54px) !important;
  line-height: 1.12 !important;
}

/* POSSIBILITY */
.possibility-head {
  grid-template-columns: minmax(170px,.35fr) minmax(0,1.65fr) !important;
  gap: clamp(60px, 8vw, 120px) !important;
}
.headline-possibility {
  font-size: clamp(39px, 4.3vw, 66px) !important;
  line-height: 1.10 !important;
}

/* CREATOR / BUSINESS */
.creator-top,
.business-head {
  grid-template-columns: minmax(0,.95fr) minmax(390px,1.05fr) !important;
  gap: clamp(80px, 9vw, 145px) !important;
}
.top-creator-title,
.top-business-title {
  font-size: clamp(43px, 4.8vw, 74px) !important;
  line-height: 1.10 !important;
}
.creator-intro,
.business-copy {
  max-width: 610px !important;
}

/* SERVICE */
.service-head {
  grid-template-columns: minmax(0,.95fr) minmax(390px,1.05fr) !important;
  gap: clamp(80px, 9vw, 145px) !important;
}
.top-service-title {
  font-size: clamp(44px, 4.9vw, 76px) !important;
  line-height: 1.10 !important;
}

/* PRODUCT — this was visibly colliding in screenshot */
.product-grid {
  grid-template-columns: minmax(0,.88fr) minmax(430px,1.12fr) !important;
  gap: clamp(90px, 10vw, 160px) !important;
}
.headline-product {
  width: 100% !important;
  max-width: 650px !important;
  font-size: clamp(38px, 4.15vw, 64px) !important;
  line-height: 1.10 !important;
}
.headline-product > span {
  white-space: nowrap !important;
}
.product-copy {
  max-width: 660px !important;
  justify-self: end;
}

/* COMMERCE — 3 deliberate lines */
.headline-commerce {
  max-width: 1100px !important;
  font-size: clamp(40px, 4.7vw, 72px) !important;
  line-height: 1.10 !important;
}

/* FAQ */
.faq-head {
  grid-template-columns: minmax(0,.9fr) minmax(360px,.72fr) !important;
  gap: clamp(80px, 9vw, 140px) !important;
}

/* NEO */
.neo-grid {
  grid-template-columns: minmax(0,.95fr) minmax(380px,1.05fr) !important;
  gap: clamp(80px, 9vw, 145px) !important;
}
.top-neo-title {
  font-size: clamp(43px, 4.8vw, 74px) !important;
  line-height: 1.10 !important;
}

/* Contact */
.top-contact-title {
  max-width: 850px !important;
  font-size: clamp(48px, 5.7vw, 88px) !important;
  line-height: 1.08 !important;
}

/* line gaps */
.safe-title > span + span,
.headline-product > span + span,
.headline-commerce > span + span,
.headline-possibility > span + span {
  margin-top: .18em !important;
}

/* Tablet: stack before columns get squeezed */
@media (max-width: 1100px) {
  .about-grid,
  .creator-top,
  .business-head,
  .service-head,
  .product-grid,
  .faq-head,
  .neo-grid,
  .possibility-head {
    grid-template-columns: 1fr !important;
    gap: 42px !important;
  }
  .headline-product > span {
    white-space: normal !important;
  }
  .product-copy {
    justify-self: start !important;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .hero-copy {
    top: auto !important;
    transform: none !important;
  }
  .mega-connect,
  .headline-possibility,
  .top-creator-title,
  .top-business-title,
  .top-service-title,
  .headline-product,
  .headline-commerce,
  .top-neo-title,
  .top-contact-title {
    font-size: clamp(34px, 10vw, 48px) !important;
    line-height: 1.12 !important;
  }
}


/* ==========================================================
   DISPLAY FIX v5 — punctuation wrapping + product collision
   ========================================================== */

/* These reviewed body texts should wrap naturally by available width.
   Do not preserve source newlines after commas / punctuation. */
.possibility-grid p,
.support-grid p {
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  line-break: strict !important;
}

/* Support cards: enough width so Japanese doesn't look chopped into tiny fragments */
.support-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.support-grid article {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.support-grid p {
  font-size: 14px !important;
  line-height: 1.85 !important;
}

/* Product section: eliminate collision completely by giving the heading a hard safe area */
@media (min-width: 1101px) {
  .product-grid {
    grid-template-columns: minmax(0, 0.78fr) minmax(480px, 1.22fr) !important;
    column-gap: clamp(110px, 11vw, 180px) !important;
  }

  .headline-product {
    max-width: 560px !important;
    font-size: clamp(35px, 3.7vw, 57px) !important;
    line-height: 1.12 !important;
  }

  .headline-product > span {
    white-space: nowrap !important;
  }

  .product-copy {
    width: 100% !important;
    max-width: 680px !important;
    justify-self: end !important;
  }
}

/* On smaller screens stack before there is any chance of overlap. */
@media (max-width: 1100px) {
  .product-grid {
    grid-template-columns: 1fr !important;
    row-gap: 44px !important;
  }

  .headline-product {
    max-width: 100% !important;
  }

  .headline-product > span {
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  .product-copy {
    justify-self: start !important;
    max-width: 760px !important;
  }
}

@media (max-width: 980px) {
  .support-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .support-grid article:last-child {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 600px) {
  .support-grid {
    grid-template-columns: 1fr !important;
  }
  .support-grid article:last-child {
    grid-column: auto !important;
  }
}


/* ==========================================================
   DISPLAY FIX v6 — micro line-break tuning
   ========================================================== */

/* Preserve only intentional paragraph blank lines/newlines in reviewed areas */
.about-copy p,
.creator-intro p,
.product-copy p,
.commerce-note p {
  white-space: pre-line !important;
}

/* Support card title: prevent last character "携" from dropping alone */
.support-grid h3 {
  word-break: keep-all !important;
  line-break: strict !important;
  overflow-wrap: normal !important;
}
.support-grid article:nth-child(5) h3 {
  font-size: 18px !important;
  letter-spacing: -0.02em;
}

/* Product headline: eliminate right-column collision completely */
@media (min-width: 1101px) {
  .product-grid {
    grid-template-columns: minmax(0, 0.72fr) minmax(500px, 1.28fr) !important;
    column-gap: clamp(120px, 12vw, 190px) !important;
  }
  .headline-product {
    max-width: 500px !important;
    font-size: clamp(33px, 3.45vw, 53px) !important;
    line-height: 1.12 !important;
  }
  .headline-product > span {
    white-space: nowrap !important;
  }
}

/* Live commerce flow: keep full Japanese phrase together, no dangling る。 */
.commerce-flow article p {
  word-break: keep-all !important;
  line-break: strict !important;
  overflow-wrap: normal !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
}
.commerce-flow article {
  padding-left: 22px !important;
  padding-right: 22px !important;
}

/* On medium screens, stack the flow cards earlier */
@media (max-width: 1150px) {
  .commerce-flow {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }
  .commerce-flow > i {
    display: none !important;
  }
}

@media (max-width: 700px) {
  .commerce-flow {
    grid-template-columns: 1fr !important;
  }
  .support-grid article:nth-child(5) h3 {
    font-size: 20px !important;
  }
}


/* ==========================================================
   DISPLAY FIX v7 — ABOUT + lower page collision prevention
   ========================================================== */

/* ABOUT page 2-column sections: give the copy column its own territory */
@media (min-width: 1101px) {
  .about-intro-grid,
  .definition-grid,
  .choice-grid,
  .relation-grid {
    grid-template-columns: minmax(0, .92fr) minmax(430px, 1.08fr) !important;
    column-gap: clamp(100px, 10vw, 165px) !important;
    align-items: start !important;
  }

  .about-intro-grid > *,
  .definition-grid > *,
  .choice-grid > *,
  .relation-grid > * {
    min-width: 0 !important;
  }

  .about-intro-grid .mega {
    max-width: 570px !important;
    font-size: clamp(48px, 5vw, 78px) !important;
    line-height: 1.08 !important;
  }

  .about-heading {
    max-width: 520px !important;
    font-size: clamp(34px, 3.5vw, 54px) !important;
    line-height: 1.12 !important;
  }

  .about-definition-title {
    max-width: 560px !important;
    font-size: clamp(43px, 4.4vw, 68px) !important;
    line-height: 1.10 !important;
  }

  .about-choice-title {
    max-width: 650px !important;
    font-size: clamp(42px, 4.3vw, 66px) !important;
    line-height: 1.10 !important;
  }

  .about-relation-title {
    max-width: 590px !important;
    font-size: clamp(43px, 4.5vw, 70px) !important;
    line-height: 1.10 !important;
  }

  .about-copy,
  .definition-copy,
  .choice-grid > div:last-child,
  .relation-copy {
    width: 100% !important;
    max-width: 650px !important;
    justify-self: end !important;
  }
}

/* Values cards: prevent single-character orphan lines */
.values-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.values-grid article {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.values-grid strong {
  font-size: clamp(20px, 1.8vw, 28px) !important;
  line-height: 1.35 !important;
  word-break: keep-all !important;
  line-break: strict !important;
  overflow-wrap: normal !important;
}
.value-title-nowrap {
  white-space: nowrap !important;
  letter-spacing: -0.03em;
}

/* ABOUT choice copy was visibly sitting under the heading */
.choice-grid > div:last-child {
  padding-left: 8px;
}
.about-choice-title > span {
  white-space: nowrap !important;
}

/* Final CTA title */
.about-final-title {
  max-width: 1000px !important;
  font-size: clamp(50px, 6.4vw, 98px) !important;
  line-height: 1.06 !important;
}

/* General lower-page safety: if a two-column section starts squeezing, stack it early */
@media (max-width: 1100px) {
  .about-intro-grid,
  .definition-grid,
  .choice-grid,
  .relation-grid,
  .creator-definition-grid,
  .creator-fit-head,
  .creator-support-head,
  .creator-choice-grid,
  .creator-reward-grid,
  .creator-faq-grid,
  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid,
  .business-service-head,
  .service-overview-grid,
  .service-analysis-grid,
  .service-flex-grid,
  .faq-detail-head,
  .company-message-grid,
  .company-profile-grid,
  .company-policy-grid,
  .contact-form-layout,
  .contact-note-grid {
    grid-template-columns: 1fr !important;
    row-gap: 42px !important;
  }

  .about-choice-title > span,
  .value-title-nowrap {
    white-space: normal !important;
  }

  .values-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 640px) {
  .values-grid {
    grid-template-columns: 1fr !important;
  }

  .values-grid strong {
    font-size: 24px !important;
  }

  .about-definition-title,
  .about-choice-title,
  .about-relation-title,
  .about-final-title {
    max-width: 100% !important;
    font-size: clamp(36px, 10.5vw, 50px) !important;
    line-height: 1.12 !important;
  }
}


/* ==========================================================
   DISPLAY FIX v8 — full lower-page responsive cleanup
   Screenshots reviewed: CREATOR / BUSINESS / SERVICE / FAQ / CONTACT
   ========================================================== */

/* Universal box / text safety */
.subpage main *,
.section *,
.contact-form *,
.faq-list *,
.values-grid *,
.fit-grid *,
.support-detail-grid *,
.reward-cards *,
.flow-grid *,
.business-value-grid *,
.business-service-grid *,
.business-flow-grid *,
stage-list *,
.service-map-grid *,
.detail-block *,
.contact-route-grid * {
  min-width: 0;
}

/* Never force Japanese long phrases into neighboring columns */
.subpage h1,
.subpage h2,
.subpage h3,
.subpage strong,
.subpage p,
.subpage li,
.subpage summary {
  max-width: 100%;
}

/* Desktop: conservative sizes for lower-page two-column hero/copy sections */
@media (min-width: 1101px) {
  .creator-definition-grid,
  .creator-fit-head,
  .creator-support-head,
  .creator-choice-grid,
  .creator-reward-grid,
  .creator-faq-grid,
  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid,
  .business-service-head,
  .service-overview-grid,
  .service-analysis-grid,
  .service-flex-grid,
  .faq-detail-head,
  .company-message-grid,
  .company-profile-grid,
  .company-policy-grid,
  .contact-form-layout,
  .contact-note-grid {
    grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr) !important;
    column-gap: clamp(88px, 9vw, 150px) !important;
    align-items: start !important;
  }

  .creator-definition h2,
  .creator-support-head h2,
  .creator-choice h2,
  .creator-reward h2,
  .creator-flow-head h2,
  .creator-faq h2,
  .business-challenge h2,
  .business-product h2,
  .business-flow-head h2,
  .business-start h2,
  .business-faq h2,
  .service-title,
  .service-map-title,
  .analysis-title,
  .flex-title,
  .faq-creator-title,
  .faq-business-title,
  .company-message-title,
  .company-profile-title,
  .company-business-title,
  .company-policy-title,
  .contact-route-title,
  .contact-form-title,
  .contact-note-title {
    font-size: clamp(38px, 4.2vw, 66px) !important;
    line-height: 1.10 !important;
  }
}

/* Tablet/mobile: stack all two-column editorial layouts earlier */
@media (max-width: 1100px) {
  .creator-definition-grid,
  .creator-fit-head,
  .creator-support-head,
  .creator-choice-grid,
  .creator-reward-grid,
  .creator-faq-grid,
  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid,
  .business-service-head,
  .service-overview-grid,
  .service-analysis-grid,
  .service-flex-grid,
  .faq-detail-head,
  .company-message-grid,
  .company-profile-grid,
  .company-policy-grid,
  .contact-form-layout,
  .contact-note-grid {
    grid-template-columns: 1fr !important;
    row-gap: 32px !important;
  }

  .creator-definition-copy,
  .creator-support-head > p,
  .creator-choice-grid > div:last-child,
  .business-challenge-grid > div:last-child,
  .business-product-copy,
  .business-service-head > p,
  .service-overview-grid > div:last-child,
  .service-analysis-grid > div:last-child,
  .service-flex-grid > div:last-child,
  .faq-detail-head > p,
  .company-message-grid > div:last-child,
  .company-policy-grid > div:last-child,
  .contact-form-intro,
  .contact-note-grid > div:last-child {
    max-width: 760px !important;
    justify-self: start !important;
  }
}

/* Mobile headline system: natural wrapping, no one-character orphaning */
@media (max-width: 767px) {
  .sub-hero h1 {
    display: inline-block !important;
    width: auto !important;
    max-width: calc(100vw - 40px) !important;
    font-size: clamp(32px, 9.6vw, 46px) !important;
    line-height: 1.10 !important;
    letter-spacing: -0.045em !important;
    white-space: normal !important;
  }

  .sub-hero h1 > span,
  .subpage .safe-title > span,
  .subpage h2 > span {
    display: block !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    line-break: strict !important;
  }

  .subpage .safe-title,
  .creator-definition h2,
  .creator-fit-head h2,
  .creator-support-head h2,
  .creator-choice h2,
  .creator-reward h2,
  .creator-flow-head h2,
  .creator-faq h2,
  .business-challenge h2,
  .business-product h2,
  .business-flow-head h2,
  .business-start h2,
  .business-faq h2,
  .business-service-head h2,
  .service-title,
  .service-map-title,
  .detail-title h2,
  .analysis-title,
  .flex-title,
  .faq-creator-title,
  .faq-business-title,
  .faq-contact-title,
  .company-message-title,
  .company-profile-title,
  .company-business-title,
  .company-policy-title,
  .company-contact-title,
  .contact-route-title,
  .contact-form-title,
  .contact-note-title {
    font-size: clamp(28px, 8.3vw, 40px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.035em !important;
  }

  .subpage h2 > span + span,
  .subpage .safe-title > span + span {
    margin-top: .10em !important;
  }

  .section {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .section-kicker {
    margin-bottom: 30px !important;
  }
}

/* CREATOR cards */
@media (max-width: 900px) {
  .fit-grid,
  .support-detail-grid,
  .reward-cards,
  .flow-grid {
    grid-template-columns: 1fr !important;
  }
  .support-detail-grid article:last-child {
    grid-column: auto !important;
  }
  .fit-grid article,
  .support-detail-grid article,
  .reward-cards article,
  .flow-grid article {
    min-height: 0 !important;
    padding: 24px 20px !important;
  }
  .fit-grid strong,
  .support-detail-grid h3,
  .reward-cards h3,
  .flow-grid h3 {
    margin-top: 28px !important;
  }
}

/* BUSINESS cards */
@media (max-width: 1000px) {
  .business-value-grid,
  .business-service-grid,
  .business-flow-grid,
  .stage-list {
    grid-template-columns: 1fr !important;
  }
  .business-value-grid article:last-child,
  .business-flow-grid article:last-child {
    grid-column: auto !important;
  }
  .business-value-grid article,
  .business-service-grid article,
  .business-flow-grid article,
  .stage-list > div {
    min-height: 0 !important;
    padding: 24px 20px !important;
  }
}

/* SERVICE detail/map cards */
@media (max-width: 1000px) {
  .service-map-grid {
    grid-template-columns: 1fr !important;
  }
  .service-map-grid article {
    min-height: 0 !important;
    padding: 24px 20px !important;
  }
  .service-map-grid h3 {
    margin-top: 28px !important;
  }

  .detail-block {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 34px 0 !important;
  }
  .detail-copy {
    grid-column: auto !important;
  }
  .detail-title h2 {
    font-size: clamp(28px, 8vw, 40px) !important;
  }
}

/* FAQ: long questions must wrap cleanly */
.faq-list summary,
.creator-faq summary,
.business-faq summary,
.faq summary {
  word-break: keep-all !important;
  overflow-wrap: break-word !important;
  line-break: strict !important;
}

@media (max-width: 767px) {
  .faq-index-grid {
    grid-template-columns: 1fr !important;
  }
  .faq-index-grid a {
    min-height: 170px !important;
    padding: 24px 20px !important;
  }
  .faq-index-grid strong {
    font-size: 22px !important;
    line-height: 1.35 !important;
  }
  .faq-list summary {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 20px 36px 20px 0 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
  }
  .faq-list details p {
    padding-left: 52px !important;
    padding-right: 12px !important;
  }
}

/* CONTACT cards and forms */
@media (max-width: 900px) {
  .contact-route-grid {
    grid-template-columns: 1fr !important;
  }
  .route-card {
    min-height: 0 !important;
    padding: 24px 20px !important;
  }
  .route-card strong {
    font-size: 22px !important;
    line-height: 1.35 !important;
  }
}

@media (max-width: 767px) {
  .contact-form {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .contact-form .full {
    grid-column: auto !important;
  }
  .contact-form input,
  .contact-form select,
  .contact-form textarea {
    font-size: 16px !important;
  }
}

/* Footer mobile: compact but orderly */
@media (max-width: 767px) {
  .neo-style-footer .footer-top {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }
  .neo-style-footer .footer-meta {
    margin-top: 18px !important;
  }
  .footer-nav {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
}

/* Do not let emphasized words create overlap */
em, strong {
  max-width: 100%;
}


/* ==========================================================
   DISPLAY FIX v9 — quote / product title hard breaks
   ========================================================== */

/* ABOUT "売らされる / 売りたい" */
.about-choice-title {
  max-width: 560px !important;
  font-size: clamp(38px, 4.0vw, 62px) !important;
  line-height: 1.12 !important;
}
.about-choice-title > span {
  display: block !important;
  white-space: nowrap !important;
}
.about-choice-title > span + span {
  margin-top: .12em !important;
}

/* BUSINESS product heading */
.biz-product-title {
  max-width: 520px !important;
  font-size: clamp(36px, 3.8vw, 58px) !important;
  line-height: 1.12 !important;
}
.biz-product-title > span {
  display: block !important;
  white-space: nowrap !important;
}
.biz-product-title > span + span {
  margin-top: .12em !important;
}

/* Give the left title column a strict safe width and more gap */
@media (min-width: 1101px) {
  .choice-grid,
  .business-product-grid {
    grid-template-columns: minmax(0, .78fr) minmax(480px, 1.22fr) !important;
    column-gap: clamp(120px, 12vw, 190px) !important;
  }

  .choice-grid > div:first-child,
  .business-product-grid > div:first-child {
    max-width: 560px !important;
  }

  .choice-grid > div:last-child,
  .business-product-copy {
    justify-self: end !important;
    width: 100% !important;
    max-width: 680px !important;
  }
}

/* Stack before any collision can occur */
@media (max-width: 1100px) {
  .choice-grid,
  .business-product-grid {
    grid-template-columns: 1fr !important;
    row-gap: 38px !important;
  }

  .about-choice-title > span,
  .biz-product-title > span {
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    line-break: strict !important;
  }

  .choice-grid > div:last-child,
  .business-product-copy {
    justify-self: start !important;
    max-width: 760px !important;
  }
}

@media (max-width: 767px) {
  .about-choice-title,
  .biz-product-title {
    max-width: 100% !important;
    font-size: clamp(32px, 9.4vw, 44px) !important;
    line-height: 1.14 !important;
  }
}


/* ===== v10 corrections ===== */
@media (min-width:1101px){
  .biz-product-title{
    max-width: 560px !important;
    font-size: clamp(34px,3.55vw,55px) !important;
  }
  .biz-product-title > span{
    white-space: nowrap !important;
  }
}
@media (max-width:1100px){
  .biz-product-title > span{
    white-space: normal !important;
    word-break: keep-all !important;
    line-break: strict !important;
  }
}


/* ==========================================================
   FINAL AUDIT LAYER v12
   ========================================================== */

/* Universal collision prevention */
main * { box-sizing: border-box; }
main [class*="grid"] > *,
main [class*="head"] > *,
main [class*="layout"] > * {
  min-width: 0;
}

/* Long Japanese headings must stay inside their own box */
main h1, main h2, main h3, main strong {
  max-width: 100%;
}

/* Prevent one-character orphaning for key short labels/titles */
.values-grid strong,
.fit-grid strong,
.business-value-grid strong,
.service-map-grid strong,
.stage-list strong,
.support-grid h3,
.support-detail-grid h3,
.reward-cards h3,
.company-business-cards h3 {
  word-break: keep-all !important;
  line-break: strict !important;
  overflow-wrap: normal !important;
}

/* Let body text wrap naturally; do not force punctuation line breaks */
main p,
main li,
main summary {
  word-break: normal;
  line-break: strict;
  overflow-wrap: break-word;
}

/* Only reviewed paragraphs preserve intentional blank lines */
.about-copy p,
.creator-intro p,
.product-copy p,
.commerce-note p {
  white-space: pre-line;
}

/* All large editorial titles: safe line-height and semantic spacing */
main h1,
main h2 {
  line-height: 1.10;
}
main h1 > span,
main h2 > span {
  display: block;
}
main h1 > span + span,
main h2 > span + span {
  margin-top: .10em;
}

/* Prevent right-column invasion on all desktop two-column editorial sections */
@media (min-width:1101px) {
  .about-intro-grid,
  .definition-grid,
  .choice-grid,
  .relation-grid,
  .creator-definition-grid,
  .creator-fit-head,
  .creator-support-head,
  .creator-choice-grid,
  .creator-reward-grid,
  .creator-faq-grid,
  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid,
  .business-service-head,
  .service-overview-grid,
  .service-analysis-grid,
  .service-flex-grid,
  .faq-detail-head,
  .company-message-grid,
  .company-profile-grid,
  .company-policy-grid,
  .contact-form-layout,
  .contact-note-grid {
    column-gap: clamp(100px, 10vw, 170px) !important;
  }

  .about-intro-grid > :first-child,
  .definition-grid > :first-child,
  .choice-grid > :first-child,
  .relation-grid > :first-child,
  .creator-definition-grid > :first-child,
  .creator-fit-head > :first-child,
  .creator-support-head > :first-child,
  .creator-choice-grid > :first-child,
  .creator-reward-grid > :first-child,
  .creator-faq-grid > :first-child,
  .business-challenge-grid > :first-child,
  .business-product-grid > :first-child,
  .business-start-grid > :first-child,
  .business-faq-grid > :first-child,
  .business-service-head > :first-child,
  .service-overview-grid > :first-child,
  .service-analysis-grid > :first-child,
  .service-flex-grid > :first-child,
  .faq-detail-head > :first-child,
  .company-message-grid > :first-child,
  .company-profile-grid > :first-child,
  .company-policy-grid > :first-child,
  .contact-form-layout > :first-child,
  .contact-note-grid > :first-child {
    max-width: 620px !important;
  }
}

/* Stack early enough on smaller screens */
@media (max-width:1100px) {
  .about-intro-grid,
  .definition-grid,
  .choice-grid,
  .relation-grid,
  .creator-definition-grid,
  .creator-fit-head,
  .creator-support-head,
  .creator-choice-grid,
  .creator-reward-grid,
  .creator-faq-grid,
  .business-challenge-grid,
  .business-product-grid,
  .business-start-grid,
  .business-faq-grid,
  .business-service-head,
  .service-overview-grid,
  .service-analysis-grid,
  .service-flex-grid,
  .faq-detail-head,
  .company-message-grid,
  .company-profile-grid,
  .company-policy-grid,
  .contact-form-layout,
  .contact-note-grid {
    grid-template-columns: 1fr !important;
    row-gap: 40px !important;
  }
}

/* Mobile spacing */
@media (max-width:767px) {
  main h1 { font-size: clamp(32px, 9.2vw, 44px) !important; }
  main h2 { font-size: clamp(28px, 8.2vw, 40px) !important; }
  main h1, main h2 { line-height: 1.12 !important; }
  main h1 > span + span,
  main h2 > span + span { margin-top: .08em !important; }

  .section {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}

.fv-keycopy-picture{
  display:block;
  width:min(46vw,700px);
  margin:0 0 24px;
}
.fv-keycopy-image{
  display:block;
  width:100%;
  height:auto;
}
@media(max-width:767px){
  .fv-keycopy-picture{
    width:min(92vw,520px);
    margin-bottom:18px;
  }
}

/* ==========================================================
   SECTION 01 — WHAT IS JASCOMA / PC layout
   Heading = image
   Copy + values = HTML text
   ========================================================== */

.section01-layout{
  background:#fff;
}

.section01-layout .section-kicker{
  margin-bottom:54px;
}

.section01-main{
  display:grid;
  grid-template-columns:minmax(0, .92fr) minmax(460px, 1.08fr);
  gap:clamp(70px, 8vw, 135px);
  align-items:start;
}

.section01-heading-wrap{
  min-width:0;
  padding-top:6px;
}

.section01-heading-image{
  display:block;
  width:min(100%, 590px);
  height:auto;
}

.section01-copy{
  padding-top:0;
  max-width:650px;
}

.section01-copy h2{
  margin:0 0 34px;
  max-width:590px;
  font-size:clamp(38px, 3.7vw, 60px);
  line-height:1.14;
  letter-spacing:-.045em;
}

.section01-copy p{
  margin:0 0 24px;
  font-size:clamp(15px, 1.18vw, 18px);
  line-height:2.0;
}

/* Turn the former floating pills into one integrated value strip */
.section01-values{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:0;
  margin-top:72px;
  border-top:1px solid #111;
  border-bottom:1px solid #111;
}

.section01-values span{
  position:relative;
  display:flex;
  align-items:center;
  min-height:76px;
  padding:0 24px 0 42px;
  border:0;
  border-radius:0;
  border-left:1px solid #d5d5d5;
  font-size:11px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.11em;
  white-space:nowrap;
}

.section01-values span:first-child{
  border-left:0;
}

.section01-values span::before{
  content:"";
  position:absolute;
  left:22px;
  top:50%;
  width:7px;
  height:7px;
  transform:translateY(-50%);
  background:#e31967;
}

/* SP layout is intentionally NOT being designed here.
   This fallback only prevents breakage until the dedicated SP design phase. */
@media(max-width:900px){
  .section01-main{
    grid-template-columns:1fr;
    gap:45px;
  }
  .section01-heading-image{
    width:min(100%, 560px);
  }
  .section01-copy{
    max-width:100%;
  }
  .section01-values{
    grid-template-columns:repeat(2,1fr);
  }
  .section01-values span:nth-child(3){
    border-left:0;
    border-top:1px solid #d5d5d5;
  }
  .section01-values span:nth-child(4){
    border-top:1px solid #d5d5d5;
  }
}

/* SECTION 01 v2 — integrate VALUES into the copy block */
.section01-values{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 34px;
  margin-top:34px;
  padding-top:22px;
  border-top:1px solid #d8d8d8;
}

.section01-values span{
  position:relative;
  display:flex;
  align-items:center;
  min-height:48px;
  padding:0 0 0 22px;
  border:0;
  border-bottom:1px solid #ededed;
  border-radius:0;
  font-size:11px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.11em;
  white-space:nowrap;
}

.section01-values span::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:10px;
  height:2px;
  transform:translateY(-50%);
  background:#e31967;
}

/* neutralize the previous full-width strip rules */
.section01-layout > .section01-values{display:none!important;}

@media(max-width:900px){
  .section01-values{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 20px;
    margin-top:28px;
  }
}

/* SECTION 01 v3 — clearer value cards, PC 2x2 / SP 1x4 */
.section01-values{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px 18px;
  margin-top:34px;
  padding-top:24px;
  border-top:1px solid #d9d9d9;
}

.section01-value{
  position:relative;
  min-height:88px;
  padding:18px 18px 16px 24px;
  background:#f7f7f7;
}

.section01-value::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:#e31967;
}

.section01-value-en{
  display:block;
  margin:0 0 8px;
  font-size:13px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:.12em;
  white-space:nowrap;
}

.section01-value-jp{
  display:block;
  font-size:13px;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.02em;
  color:#555;
}

/* neutralize previous span-only rules */
.section01-values > span{display:none!important;}

@media(max-width:767px){
  .section01-values{
    grid-template-columns:1fr;
    gap:10px;
    margin-top:28px;
    padding-top:20px;
  }

  .section01-value{
    min-height:auto;
    padding:15px 16px 14px 21px;
  }

  .section01-value-en{
    margin-bottom:6px;
    font-size:12px;
    letter-spacing:.10em;
  }

  .section01-value-jp{
    font-size:12px;
  }
}

/* SECTION 01 v4 — editorial value list, not card/link UI */
.section01-values{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:42px;
  row-gap:0;
  margin-top:36px;
  padding-top:0;
  border-top:0;
}

.section01-value{
  position:relative;
  min-height:78px;
  padding:16px 0 14px;
  background:transparent;
  border-top:1px solid #d4d4d4;
  cursor:default;
}

.section01-value::before{
  content:"";
  position:absolute;
  left:0;
  top:-1px;
  width:46px;
  height:2px;
  background:#e31967;
}

.section01-value-en{
  display:block;
  margin:0 0 7px;
  font-size:13px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.12em;
  white-space:nowrap;
  color:#050505;
}

.section01-value-jp{
  display:block;
  font-size:13px;
  line-height:1.55;
  font-weight:500;
  letter-spacing:.02em;
  color:#666;
}

/* cancel the prior card treatment */
.section01-value{
  box-shadow:none!important;
  border-left:0!important;
  border-right:0!important;
  border-bottom:0!important;
  border-radius:0!important;
}

@media(max-width:767px){
  .section01-values{
    grid-template-columns:1fr;
    column-gap:0;
    margin-top:30px;
  }

  .section01-value{
    min-height:auto;
    padding:15px 0 14px;
  }

  .section01-value:last-child{
    border-bottom:1px solid #d4d4d4!important;
  }

  .section01-value-en{
    margin-bottom:5px;
    font-size:12px;
    letter-spacing:.10em;
  }

  .section01-value-jp{
    font-size:12px;
  }
}

/* ==========================================================
   SECTION 02 — NEW POSSIBILITY
   Heading = image
   Point titles/body = HTML text
   PC: heading left / editorial list right
   SP: stacked
   ========================================================== */

.section02-layout{
  background:#050505;
  color:#fff;
}

.section02-layout .section-kicker{
  margin-bottom:54px;
}

.section02-main{
  display:grid;
  grid-template-columns:minmax(0,.93fr) minmax(520px,1.07fr);
  gap:clamp(70px,8vw,130px);
  align-items:start;
}

.section02-heading-wrap{
  min-width:0;
  padding-top:4px;
}

.section02-heading-image{
  display:block;
  width:min(100%,610px);
  height:auto;
}

.section02-points{
  border-top:1px solid rgba(255,255,255,.28);
}

.section02-point{
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:20px;
  padding:26px 0 28px;
  border-bottom:1px solid rgba(255,255,255,.18);
}

.section02-point-num{
  padding-top:5px;
  color:#e31967;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
}

.section02-point-body h3{
  margin:0 0 12px;
  color:#fff;
  font-size:clamp(23px,2vw,31px);
  line-height:1.2;
  letter-spacing:-.035em;
}

.section02-point-body p{
  margin:0;
  max-width:680px;
  color:rgba(255,255,255,.72);
  font-size:15px;
  line-height:1.9;
}

@media(max-width:900px){
  .section02-main{
    grid-template-columns:1fr;
    gap:44px;
  }

  .section02-heading-image{
    width:min(100%,650px);
  }
}

@media(max-width:767px){
  .section02-layout .section-kicker{
    margin-bottom:34px;
  }

  .section02-main{
    gap:34px;
  }

  .section02-heading-image{
    width:100%;
  }

  .section02-point{
    grid-template-columns:38px minmax(0,1fr);
    gap:12px;
    padding:21px 0 22px;
  }

  .section02-point-num{
    font-size:10px;
  }

  .section02-point-body h3{
    margin-bottom:9px;
    font-size:22px;
  }

  .section02-point-body p{
    font-size:14px;
    line-height:1.85;
  }
}

/* ==========================================================
   01/02 SECTION LABEL — full-width inverse band
   ONLY label presentation is changed.
   Existing magenta and heading-image colors are untouched.
   ========================================================== */

.jas-label-band{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-bottom:clamp(45px,6vw,90px);
}

.jas-label-band__inner{
  width:min(1280px, calc(100% - 48px));
  margin:0 auto;
  padding:14px 0;
}

/* no local rectangle/pill behind the label */
.jas-label-band .jas-label-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  width:max-content;
  max-width:100%;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
  white-space:nowrap;
}

/* 01: white section → black band / white label / white circle outline */
.jas-label-band--black{
  background:#050505;
}
.jas-label-band--black .jas-label-kicker{
  color:#fff !important;
}
.jas-label-band--black .jas-label-kicker span{
  background:transparent !important;
  color:#fff !important;
  border-color:#fff !important;
}

/* 02: black section → white band / black label / black circle outline */
.jas-label-band--white{
  background:#fff;
}
.jas-label-band--white .jas-label-kicker{
  color:#050505 !important;
}
.jas-label-band--white .jas-label-kicker span{
  background:transparent !important;
  color:#050505 !important;
  border-color:#050505 !important;
}

@media(max-width:767px){
  .jas-label-band{
    margin-bottom:42px;
  }
  .jas-label-band__inner{
    width:calc(100% - 40px);
    padding:12px 0;
  }
}

/* ==========================================================
   SECTION 03 — FOR CREATOR
   Existing 01/02 rules remain untouched.
   ========================================================== */

.section03-layout{
  background:#fff !important;
  color:#050505;
}

.section03-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section03-top{
  align-items:start;
}

.section03-heading-picture{
  display:block;
  width:min(100%,680px);
}

.section03-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section03-layout .support-grid h3,
.section03-layout .support-grid .live-video-heading,
.section03-layout .support-grid h3 span,
.section03-layout .support-grid .live-video-heading span{
  margin:0;
  font-size:22px;
  line-height:1.32;
  font-weight:900;
  letter-spacing:-0.035em;
  color:#050505 !important;
  text-decoration:none !important;
}

.section03-layout .support-grid h3{
  margin:0 0 18px;
}

.section03-layout .support-grid h3 > span{
  display:block;
}

.section03-layout .live-video-heading{
  display:flex;
  flex-direction:column;
  gap:0;
}

/* Keep support cards as the existing design; only the requested line breaks change. */

@media(max-width:767px){
  .section03-label-band{
    margin-top:0;
    margin-bottom:42px;
  }

  .section03-heading-picture{
    width:100%;
  }

  .section03-layout .support-grid h3,
  .section03-layout .support-grid .live-video-heading,
  .section03-layout .support-grid h3 span,
  .section03-layout .support-grid .live-video-heading span{
    font-size:22px;
    line-height:1.3;
  }
}

/* ==========================================================
   SECTION 04 — FOR BUSINESS
   Cumulative preview from page start through section 04.
   Existing 01–03 styling remains unchanged.
   ========================================================== */

.section04-layout{
  background:#050505 !important;
  color:#fff;
}

.section04-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

/* 04 is black background, so the full-width band is white,
   label text and number circle are black. */
.section04-label-band.jas-label-band--white{
  background:#fff;
}

.section04-label-band .jas-label-kicker{
  color:#050505 !important;
}

.section04-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#050505 !important;
  border-color:#050505 !important;
}

.section04-head{
  align-items:start;
}

.section04-heading-picture{
  display:block;
  width:min(100%,680px);
}

.section04-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section04-layout .business-copy p{
  color:#d7d7d7;
}

/* Keep existing card layout; invert only what is needed for black section */
.section04-layout .business-values{
  background:#333;
  border-color:#333;
}

.section04-layout .business-values article{
  background:#0b0b0b;
  color:#fff;
}

.section04-layout .business-values article p{
  color:#c9c9c9;
}

/* Match 03's number-to-heading spacing */
.section04-layout .business-values strong{
  margin:0 0 18px;
  color:#fff;
}

.section04-layout .business-values article > span{
  display:block;
  margin:0;
}

/* Existing dark CTA would disappear on black, so invert it for legibility */
.section04-layout .business-cta-wrap{
  border-top-color:#333;
}

.section04-layout .round-cta.dark{
  background:#fff;
  color:#050505;
}

@media(max-width:767px){
  .section04-label-band{
    margin-top:0;
    margin-bottom:42px;
  }

  .section04-heading-picture{
    width:100%;
  }

  .section04-layout .business-values strong{
    margin:0 0 18px;
  }
}

/* ==========================================================
   SHARED SECTION END CTA — SECTION 03 / 04
   Same layout, inverse text color by section background.
   ========================================================== */
.section-end-cta{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,360px);
  gap:32px;
  align-items:center;
  margin-top:clamp(58px,7vw,92px);
  padding-top:34px;
  border-top:1px solid;
}

.section-end-cta--light{
  border-top-color:#050505;
  color:#050505;
}

.section-end-cta--dark{
  border-top-color:#444;
  color:#fff;
}

.section-end-cta__copy{
  margin:0;
  font-size:clamp(28px,3vw,48px);
  line-height:1.12;
  font-weight:900;
  letter-spacing:-.045em;
}

.section-end-cta__copy strong{
  color:inherit;
  font-weight:900;
}

.section-end-cta__button{
  min-height:74px;
  padding:0 28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  border-radius:999px;
  background:#e31967;
  color:#fff;
  font-size:14px;
  font-weight:900;
  line-height:1.3;
}

.section-end-cta__button span{
  font-size:28px;
  line-height:1;
}

@media(max-width:767px){
  .section-end-cta{
    grid-template-columns:1fr;
    gap:22px;
    margin-top:52px;
    padding-top:28px;
  }

  .section-end-cta__copy{
    font-size:clamp(28px,8.5vw,40px);
  }

  .section-end-cta__button{
    width:100%;
    min-height:64px;
    padding:0 22px;
    font-size:13px;
  }
}

/* ==========================================================
   SECTION 01–03 rollover update
   - PC: hover reveals alternate panel
   - SP / touch: keep the original static layout
   ========================================================== */
.section01-value,
.section02-point,
.support-grid article{
  cursor:default;
}

.section01-values{
  gap:1px !important;
  background:#d5d5d5 !important;
  border-top:1px solid #111 !important;
  border-bottom:1px solid #111 !important;
}

.section01-value{
  position:relative;
  min-height:118px;
  padding:22px 22px 22px 42px;
  background:#fff;
  overflow:hidden;
  transition:transform .24s ease;
}

.section01-value::before{
  content:"";
  position:absolute;
  left:22px;
  top:26px;
  width:7px;
  height:7px;
  background:#e31967;
  z-index:2;
}

.section01-value-en,
.section01-value-jp{
  position:relative;
  z-index:1;
  display:block;
}

.section01-value-en{
  font-size:11px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.11em;
}

.section01-value-jp{
  margin-top:10px;
  font-size:20px;
  font-weight:900;
  line-height:1.28;
  letter-spacing:-.02em;
}

.section01-value-hover{
  position:absolute;
  inset:0;
  padding:22px 22px 22px 42px;
  background:#050505;
  color:#fff;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .26s ease, transform .26s ease;
  display:flex;
  align-items:center;
}

.section01-value-hover p{
  margin:0;
  color:rgba(255,255,255,.84);
  font-size:13px;
  line-height:1.8;
}

.section01-value:hover{
  transform:translateY(-4px);
}

.section01-value:hover .section01-value-hover{
  opacity:1;
  transform:none;
}

.section02-point,
.support-grid article{
  position:relative;
  overflow:hidden;
}

.section02-rollover,
.section03-rollover{
  position:absolute;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .26s ease, transform .26s ease;
  display:flex;
  flex-direction:column;
  justify-content:center;
  z-index:3;
}

.section02-rollover{
  inset:0 0 0 56px;
  padding:26px 30px;
  background:#fff;
  color:#050505;
}

.section03-rollover{
  inset:0;
  padding:28px 22px;
  background:#050505;
  color:#fff;
}

.section02-rollover small,
.section03-rollover small{
  display:block;
  margin-bottom:10px;
  color:#e31967;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
}

.section02-rollover strong,
.section03-rollover strong{
  display:block;
  margin:0 0 10px;
  font-size:14px;
  line-height:1.85;
  letter-spacing:0;
}

.section02-rollover p,
.section03-rollover p{
  margin:0;
  font-size:14px;
  line-height:1.85;
}

.section02-rollover p{ color:#555; }
.section03-rollover p{ color:rgba(255,255,255,.78); }


.section04-values article{
  position:relative;
  overflow:hidden;
  transition:transform .25s ease, background .25s ease;
}

.section04-rollover{
  position:absolute;
  inset:0;
  padding:28px 22px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .26s ease, transform .26s ease;
  z-index:3;
  background:#fff;
  color:#050505;
}

.section04-rollover small{
  display:block;
  margin-bottom:10px;
  color:#e31967;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
}

.section04-rollover strong{
  display:block;
  margin:0 0 10px;
  font-size:clamp(20px,1.9vw,26px);
  line-height:1.25;
  letter-spacing:-.03em;
  color:#050505 !important;
}

.section04-rollover p{
  margin:0;
  font-size:14px;
  line-height:1.85;
  color:#555 !important;
}

.section04-values article:hover .section04-rollover{
  opacity:1;
  transform:none;
}

.section04-values article:hover > span,
.section04-values article:hover > strong,
.section04-values article:hover > p{
  opacity:.06;
}

.section02-point:hover .section02-rollover,
.support-grid article:hover .section03-rollover{
  opacity:1;
  transform:none;
}

.support-grid article:hover h3,
.support-grid article:hover p,
.support-grid article:hover > span{
  opacity:.06;
}

@media(max-width:900px){
  .section01-value{
    min-height:138px;
  }
}

@media(max-width:767px){
  .section01-value{
    min-height:132px;
    padding:20px 18px 20px 34px;
  }

  .section01-value::before{
    left:16px;
    top:24px;
  }

  .section01-value-hover{
    padding:20px 18px 20px 34px;
  }

  .section01-value-jp{
    font-size:18px;
  }

  .section02-rollover{
    inset:0 0 0 38px;
    padding:18px 18px 18px 16px;
  }

  .section03-rollover{
    padding:22px 18px;
  }
}

@media(hover:none){
  .section01-value:hover,
  .section02-point:hover,
  .support-grid article:hover{
    transform:none;
  }

  .section01-value-hover,
  .section02-rollover,
  .section03-rollover,
  .section04-rollover{
    display:none;
  }

  .support-grid article:hover h3,
  .support-grid article:hover p,
  .support-grid article:hover > span,
  .section04-values article:hover > span,
  .section04-values article:hover > strong,
  .section04-values article:hover > p{
    opacity:1;
  }
}

.section01-value-hover{
  z-index:10 !important;
  background:#050505 !important;
  opacity:0;
}

.section01-value:hover .section01-value-en,
.section01-value:hover .section01-value-jp{
  opacity:0;
}

.section01-value:hover::before{
  opacity:0;
}

.section01-value:hover .section01-value-hover{
  opacity:1 !important;
}

/* ==========================================================
   SECTION 05 — OUR SERVICE
   white section / black full-width label band
   ========================================================== */
.section05-layout{
  background:#fff !important;
  color:#050505 !important;
}

.section05-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section05-label-band.jas-label-band--black{
  background:#050505;
}

.section05-label-band .jas-label-kicker{
  color:#fff !important;
}

.section05-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#fff !important;
  border-color:#fff !important;
}

.section05-head{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr);
  gap:clamp(54px,8vw,120px);
  align-items:end;
}

.section05-heading-picture{
  display:block;
  width:min(100%,720px);
}

.section05-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section05-intro{
  margin:0;
  max-width:620px;
  color:#444;
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.95;
}

.section05-services{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  margin-top:clamp(64px,8vw,110px);
  background:#d7d7d7;
  border:1px solid #d7d7d7;
}

.section05-service{
  position:relative;
  min-height:250px;
  padding:28px 24px;
  overflow:hidden;
  background:#fff;
  transition:transform .25s ease;
}

.section05-service > span{
  display:block;
  margin:0;
  color:#e31967;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
}

.section05-service h3{
  margin:54px 0 10px;
  color:#050505;
  font-size:24px;
  line-height:1.18;
  font-weight:900;
  letter-spacing:.02em;
}

.section05-service > p{
  margin:0;
  color:#666;
  font-size:14px;
  line-height:1.8;
}

.section05-rollover{
  position:absolute;
  inset:0;
  z-index:3;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:28px 24px;
  background:#050505;
  color:#fff;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .26s ease,transform .26s ease;
}

.section05-rollover small{
  display:block;
  margin-bottom:11px;
  color:#e31967;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.13em;
}

.section05-rollover strong{
  display:block;
  margin-bottom:10px;
  color:#fff;
  font-size:18px;
  line-height:1.35;
  font-weight:900;
  letter-spacing:-.025em;
}

.section05-rollover p{
  margin:0;
  color:rgba(255,255,255,.76);
  font-size:14px;
  line-height:1.8;
}

.section05-service:hover{
  transform:translateY(-5px);
}

.section05-service:hover .section05-rollover{
  opacity:1;
  transform:none;
}

.section05-service:hover > span,
.section05-service:hover > h3,
.section05-service:hover > p{
  opacity:.05;
}

@media(max-width:1000px){
  .section05-head{
    grid-template-columns:1fr;
    gap:42px;
  }
  .section05-services{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:767px){
  .section05-label-band{
    margin-top:0;
    margin-bottom:42px;
  }
  .section05-heading-picture{
    width:100%;
  }
  .section05-services{
    grid-template-columns:1fr;
  }
  .section05-service{
    min-height:210px;
  }
  .section05-service h3{
    margin-top:38px;
  }
}

@media(hover:none){
  .section05-service:hover{
    transform:none;
  }
  .section05-rollover{
    display:none;
  }
  .section05-service:hover > span,
  .section05-service:hover > h3,
  .section05-service:hover > p{
    opacity:1;
  }
}

/* ==========================================================
   Requested refinement:
   - Increase pre-hover number size for sections 02–05
   - Open up spacing between each number and its text block
   - Keep hover content styling untouched
   ========================================================== */

.section02-point{
  grid-template-columns:64px minmax(0,1fr) !important;
  gap:26px !important;
  padding:28px 0 30px !important;
}

.section02-point-num,
.section03-layout .support-grid article > span,
.section04-layout .business-values article > span,
.section05-service > span{
  font-size:13px !important;
  line-height:1 !important;
  letter-spacing:.10em !important;
  font-weight:900 !important;
}

.section03-layout .support-grid article > span,
.section04-layout .business-values article > span,
.section05-service > span{
  display:block !important;
  margin:0 0 20px !important;
}

.section03-layout .support-grid h3{
  margin:0 0 18px !important;
}

.section04-layout .business-values strong{
  margin:0 0 18px !important;
}

.section05-service h3{
  margin:0 0 14px !important;
}

@media(max-width:767px){
  .section02-point{
    grid-template-columns:44px minmax(0,1fr) !important;
    gap:16px !important;
    padding:22px 0 24px !important;
  }

  .section02-point-num,
  .section03-layout .support-grid article > span,
  .section04-layout .business-values article > span,
  .section05-service > span{
    font-size:12px !important;
  }

  .section03-layout .support-grid article > span,
  .section04-layout .business-values article > span,
  .section05-service > span{
    margin:0 0 16px !important;
  }
}

/* ==========================================================
   SECTION 06 — PRODUCT DISCOVERY
   black section / white full-width label band
   ========================================================== */
.section06-layout{
  background:#050505 !important;
  color:#fff !important;
}

.section06-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section06-label-band.jas-label-band--white{
  background:#fff;
}

.section06-label-band .jas-label-kicker{
  color:#050505 !important;
}

.section06-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#050505 !important;
  border-color:#050505 !important;
}

.section06-head{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(56px,8vw,125px);
  align-items:start;
}

.section06-heading-picture{
  display:block;
  width:min(100%,760px);
}

.section06-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section06-copy{
  padding-top:8px;
}

.section06-copy p{
  margin:0 0 24px;
  color:rgba(255,255,255,.76);
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.95;
}

.section06-matrix{
  margin-top:clamp(70px,9vw,125px);
  padding-top:34px;
  border-top:1px solid rgba(255,255,255,.36);
}

.section06-matrix-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);
  gap:48px;
  align-items:end;
  margin-bottom:34px;
}

.section06-matrix-title{
  margin:0;
  font-size:clamp(28px,3.1vw,48px);
  line-height:1;
  font-weight:900;
  letter-spacing:-.04em;
}

.section06-matrix-intro{
  margin:0;
  color:rgba(255,255,255,.67);
  font-size:14px;
  line-height:1.85;
}

.section06-matrix-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:#333;
  border:1px solid #333;
}

.section06-matrix-item{
  min-height:132px;
  padding:22px 24px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:20px;
  align-items:center;
  background:#0b0b0b;
}

.section06-matrix-item span{
  color:#e31967;
  font-size:13px;
  font-weight:900;
  letter-spacing:.10em;
}

.section06-matrix-item strong{
  color:#fff;
  font-size:clamp(18px,1.6vw,24px);
  line-height:1.3;
  letter-spacing:-.02em;
}

.section06-matrix-bottom{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(34px,7vw,100px);
  margin-top:38px;
}

.section06-matrix-bottom p{
  margin:0;
  color:rgba(255,255,255,.72);
  font-size:14px;
  line-height:1.9;
}

.section06-matrix-bottom strong{
  color:#fff;
}

@media(max-width:900px){
  .section06-head,
  .section06-matrix-head,
  .section06-matrix-bottom{
    grid-template-columns:1fr;
    gap:38px;
  }
  .section06-matrix-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:767px){
  .section06-label-band{
    margin-top:0;
    margin-bottom:42px;
  }
  .section06-heading-picture{
    width:100%;
  }
  .section06-matrix{
    margin-top:58px;
    padding-top:28px;
  }
  .section06-matrix-item{
    min-height:112px;
    grid-template-columns:42px minmax(0,1fr);
    gap:14px;
    padding:19px 18px;
  }
  .section06-matrix-item span{
    font-size:12px;
  }
  .section06-matrix-item strong{
    font-size:18px;
  }
}

/* ==========================================================
   SECTION 07 — LIVE COMMERCE
   white section / black full-width label band
   ========================================================== */
.section07-layout{
  background:#fff !important;
  color:#050505 !important;
}

.section07-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section07-label-band.jas-label-band--black{
  background:#050505;
}

.section07-label-band .jas-label-kicker{
  color:#fff !important;
}

.section07-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#fff !important;
  border-color:#fff !important;
}

.section07-head{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(56px,8vw,125px);
  align-items:start;
}

.section07-heading-picture{
  display:block;
  width:min(100%,720px);
}

.section07-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section07-copy{
  padding-top:8px;
}

.section07-overline{
  margin:0 0 18px !important;
  color:#e31967 !important;
  font-size:12px !important;
  font-weight:900;
  letter-spacing:.16em;
}

.section07-copy p{
  margin:0 0 22px;
  color:#444;
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.95;
}

.section07-flow{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  margin-top:clamp(70px,9vw,120px);
  background:#d7d7d7;
  border:1px solid #d7d7d7;
}

.section07-step{
  position:relative;
  min-height:250px;
  padding:28px 24px;
  overflow:hidden;
  background:#fff;
  transition:transform .25s ease;
}

.section07-step > span{
  display:block;
  margin:0 0 20px;
  color:#e31967;
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:.10em;
}

.section07-step h3{
  margin:0 0 18px;
  color:#050505;
  font-size:24px;
  line-height:1.18;
  font-weight:900;
  letter-spacing:.03em;
}

.section07-step > p{
  margin:0;
  color:#666;
  font-size:14px;
  line-height:1.8;
}

.section07-rollover{
  position:absolute;
  inset:0;
  z-index:3;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:28px 24px;
  background:#050505;
  color:#fff;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .26s ease,transform .26s ease;
}

.section07-rollover small{
  display:block;
  margin-bottom:11px;
  color:#e31967;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.13em;
}

.section07-rollover strong{
  display:block;
  margin-bottom:10px;
  color:#fff;
  font-size:18px;
  line-height:1.35;
  font-weight:900;
  letter-spacing:-.025em;
}

.section07-rollover p{
  margin:0;
  color:rgba(255,255,255,.76);
  font-size:14px;
  line-height:1.8;
}

.section07-step:hover{
  transform:translateY(-5px);
}

.section07-step:hover .section07-rollover{
  opacity:1;
  transform:none;
}

.section07-step:hover > span,
.section07-step:hover > h3,
.section07-step:hover > p{
  opacity:.05;
}

.section07-note{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.7fr);
  gap:clamp(48px,8vw,120px);
  align-items:end;
  margin-top:clamp(60px,8vw,100px);
  padding-top:36px;
  border-top:1px solid #050505;
}

.section07-note h3{
  margin:0 0 18px;
  font-size:clamp(28px,3vw,44px);
  line-height:1.1;
  letter-spacing:-.04em;
}

.section07-note p{
  margin:0;
  color:#555;
  font-size:14px;
  line-height:1.9;
}

.section07-badge{
  justify-self:end;
  width:190px;
  height:190px;
  display:grid;
  place-items:center;
  border:1px solid #050505;
  border-radius:50%;
  text-align:center;
  font-size:14px;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.08em;
  transform:rotate(-8deg);
}

@media(max-width:1000px){
  .section07-head,
  .section07-note{
    grid-template-columns:1fr;
    gap:42px;
  }

  .section07-flow{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .section07-badge{
    justify-self:start;
  }
}

@media(max-width:767px){
  .section07-label-band{
    margin-top:0;
    margin-bottom:42px;
  }

  .section07-heading-picture{
    width:100%;
  }

  .section07-flow{
    grid-template-columns:1fr;
  }

  .section07-step{
    min-height:210px;
  }

  .section07-step > span{
    margin-bottom:16px;
    font-size:12px;
  }

  .section07-badge{
    width:150px;
    height:150px;
  }
}

@media(hover:none){
  .section07-step:hover{
    transform:none;
  }

  .section07-rollover{
    display:none;
  }

  .section07-step:hover > span,
  .section07-step:hover > h3,
  .section07-step:hover > p{
    opacity:1;
  }
}

/* ==========================================================
   SECTION 08 — FAQ
   black section / white full-width label band
   ========================================================== */
.section08-layout{
  background:#050505 !important;
  color:#fff !important;
}

.section08-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section08-label-band.jas-label-band--white{
  background:#fff;
}

.section08-label-band .jas-label-kicker{
  color:#050505 !important;
}

.section08-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#050505 !important;
  border-color:#050505 !important;
}

.section08-head{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:clamp(56px,8vw,125px);
  align-items:end;
}

.section08-heading-picture{
  display:block;
  width:min(100%,650px);
}

.section08-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section08-intro{
  margin:0;
  max-width:620px;
  color:rgba(255,255,255,.72);
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.95;
}

.section08-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(42px,6vw,82px);
  margin-top:clamp(70px,9vw,120px);
}

.section08-column-title{
  margin:0;
  padding-bottom:18px;
  border-bottom:3px solid #fff;
  color:#fff;
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:.14em;
}

.section08-column details{
  border-bottom:1px solid rgba(255,255,255,.25);
}

.section08-column summary{
  position:relative;
  list-style:none;
  cursor:pointer;
  padding:24px 48px 24px 0;
  color:#fff;
  font-size:15px;
  font-weight:900;
  line-height:1.6;
}

.section08-column summary::-webkit-details-marker{
  display:none;
}

.section08-column summary::before,
.section08-column summary::after{
  content:"";
  position:absolute;
  right:4px;
  top:50%;
  width:17px;
  height:2px;
  background:#fff;
  transition:transform .22s ease,background .22s ease;
}

.section08-column summary::after{
  transform:rotate(90deg);
}

.section08-column details[open] summary::before,
.section08-column details[open] summary::after{
  background:#e31967;
}

.section08-column details[open] summary::after{
  transform:rotate(0);
}

.section08-column details p{
  margin:0;
  padding:0 48px 24px 0;
  color:rgba(255,255,255,.68);
  font-size:14px;
  line-height:1.9;
}

.section08-more{
  display:flex;
  justify-content:flex-end;
  margin-top:42px;
}

.section08-more a{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:38px;
  min-width:260px;
  padding:18px 0;
  border-bottom:1px solid #fff;
  color:#fff;
  font-size:13px;
  font-weight:900;
}

.section08-more a span{
  color:#e31967;
  font-size:24px;
  line-height:1;
}

@media(max-width:900px){
  .section08-head,
  .section08-columns{
    grid-template-columns:1fr;
    gap:42px;
  }
}

@media(max-width:767px){
  .section08-label-band{
    margin-top:0;
    margin-bottom:42px;
  }

  .section08-heading-picture{
    width:100%;
  }

  .section08-columns{
    margin-top:56px;
  }

  .section08-column summary{
    padding:21px 40px 21px 0;
    font-size:14px;
  }

  .section08-column details p{
    padding-right:20px;
  }

  .section08-more{
    justify-content:flex-start;
  }

  .section08-more a{
    width:100%;
    min-width:0;
  }
}

/* ==========================================================
   SECTION 09 — RELATED BUSINESS
   white section / black full-width label band
   ========================================================== */
.section09-layout{
  background:#fff !important;
  color:#050505 !important;
}

.section09-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section09-label-band.jas-label-band--black{
  background:#050505;
}

.section09-label-band .jas-label-kicker{
  color:#fff !important;
}

.section09-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#fff !important;
  border-color:#fff !important;
}

.section09-head{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(56px,8vw,125px);
  align-items:end;
}

.section09-heading-picture{
  display:block;
  width:min(100%,720px);
}

.section09-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section09-intro{
  margin:0;
  max-width:620px;
  color:#444;
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.95;
}

.section09-related{
  margin-top:clamp(70px,9vw,120px);
  padding-top:36px;
  border-top:1px solid #050505;
}

.section09-related-card{
  display:grid;
  grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr);
  gap:clamp(44px,7vw,100px);
  align-items:start;
}

.section09-brand{
  margin:0;
  font-size:clamp(34px,4vw,62px);
  line-height:1;
  font-weight:900;
  letter-spacing:-.045em;
}

.section09-brand span{
  display:block;
  margin-top:12px;
  color:#e31967;
  font-size:12px;
  line-height:1.4;
  letter-spacing:.12em;
}

.section09-copy p{
  margin:0 0 22px;
  color:#444;
  font-size:15px;
  line-height:1.95;
}

.section09-link{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  min-width:280px;
  margin-top:8px;
  padding:18px 0;
  border-bottom:1px solid #050505;
  color:#050505;
  font-size:13px;
  font-weight:900;
}

.section09-link span{
  color:#e31967;
  font-size:24px;
  line-height:1;
}

@media(max-width:900px){
  .section09-head,
  .section09-related-card{
    grid-template-columns:1fr;
    gap:42px;
  }
}

@media(max-width:767px){
  .section09-label-band{
    margin-top:0;
    margin-bottom:42px;
  }

  .section09-heading-picture{
    width:100%;
  }

  .section09-related{
    margin-top:56px;
    padding-top:28px;
  }

  .section09-link{
    width:100%;
    min-width:0;
  }
}

.section09-brand-image-wrap{
  width:min(100%,440px);
}
.section09-brand-image{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}
@media(max-width:767px){
  .section09-brand-image-wrap{
    width:min(100%,400px);
  }
}

/* ==========================================================
   SECTION 10 — CONTACT
   black section / white full-width label band
   ========================================================== */
.section10-layout{
  background:#050505 !important;
  color:#fff !important;
}

.section10-label-band{
  margin-top:0;
  margin-bottom:clamp(48px,6vw,84px);
}

.section10-label-band.jas-label-band--white{
  background:#fff;
}

.section10-label-band .jas-label-kicker{
  color:#050505 !important;
}

.section10-label-band .jas-label-kicker span{
  background:transparent !important;
  color:#050505 !important;
  border-color:#050505 !important;
}

.section10-head{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(56px,8vw,125px);
  align-items:end;
}

.section10-heading-picture{
  display:block;
  width:min(100%,720px);
}

.section10-heading-image{
  display:block;
  width:100%;
  height:auto;
}

.section10-intro{
  margin:0;
  max-width:620px;
  color:rgba(255,255,255,.72);
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.95;
}

.section10-routes{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  margin-top:clamp(70px,9vw,120px);
  background:#333;
  border:1px solid #333;
}

.section10-route{
  position:relative;
  min-height:300px;
  padding:28px 26px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  background:#0b0b0b;
  color:#fff;
  transition:background .24s ease,transform .24s ease;
}

.section10-route-num{
  color:#e31967;
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:.10em;
}

.section10-route-content small{
  display:block;
  margin-bottom:12px;
  color:#e31967;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.14em;
}

.section10-route-content strong{
  display:block;
  max-width:360px;
  color:#fff;
  font-size:clamp(23px,2.1vw,34px);
  line-height:1.3;
  font-weight:900;
  letter-spacing:-.035em;
}

.section10-route-content p{
  margin:14px 0 0;
  color:rgba(255,255,255,.64);
  font-size:14px;
  line-height:1.8;
}

.section10-route-arrow{
  position:absolute;
  right:25px;
  bottom:22px;
  font-size:30px;
  line-height:1;
}

.section10-route:hover{
  background:#e31967;
  transform:translateY(-6px);
}

.section10-route:hover .section10-route-num,
.section10-route:hover .section10-route-content small{
  color:#fff;
}

.section10-route:hover .section10-route-content p{
  color:rgba(255,255,255,.82);
}

@media(max-width:1000px){
  .section10-head{
    grid-template-columns:1fr;
    gap:42px;
  }

  .section10-routes{
    grid-template-columns:1fr;
  }

  .section10-route{
    min-height:230px;
  }
}

@media(max-width:767px){
  .section10-label-band{
    margin-top:0;
    margin-bottom:42px;
  }

  .section10-heading-picture{
    width:100%;
  }

  .section10-routes{
    margin-top:56px;
  }

  .section10-route{
    min-height:220px;
    padding:24px 22px;
  }
}

.section10-route[href="./contact.html#business-form"] .section10-route-content strong{
  white-space:nowrap;
}
@media(max-width:420px){
  .section10-route[href="./contact.html#business-form"] .section10-route-content strong{
    white-space:normal;
  }
}

/* Header: transparent at TOP, clearly visible semi-transparent white after scroll */
.header{
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

.header.scrolled{
  background:rgba(255,255,255,.985) !important;
  border-bottom:1px solid rgba(5,5,5,.08) !important;
  box-shadow:0 8px 24px rgba(0,0,0,.08) !important;
  backdrop-filter:blur(14px) !important;
  -webkit-backdrop-filter:blur(14px) !important;
}

/* CONTACT nav: same black as other items; hover line remains magenta */
.header .nav .contact-link{
  color:#050505 !important;
}
.header .nav .contact-link:hover{
  color:#050505 !important;
}

/* ==========================================================
   FOOTER — NEO STREAM style direction
   black base / left brand block / right navigation
   ========================================================== */
.jas-footer{
  background:#050505;
  color:#fff;
  padding:clamp(64px,7vw,100px) clamp(24px,6vw,110px) 34px;
  border-top:1px solid #2b2b2b;
}

.jas-footer__top{
  display:grid;
  grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);
  gap:clamp(60px,9vw,150px);
  align-items:start;
  padding-bottom:clamp(58px,7vw,90px);
}

.jas-footer__brand{
  max-width:420px;
}

.jas-footer__logo{
  width:min(100%,360px);
}

.jas-footer__logo picture,
.jas-footer__logo img{
  display:block;
  width:100%;
  height:auto;
}

/* Footer is black, so render the approved SUB logo as white. */
.jas-footer__logo img{
  filter:brightness(0) invert(1);
}

.jas-footer__meta{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin-top:30px;
}

.jas-footer__meta strong{
  font-size:13px;
  font-weight:900;
  letter-spacing:.12em;
}

.jas-footer__meta span,
.jas-footer__meta small{
  color:#8f8f8f;
  font-size:11px;
  line-height:1.6;
  letter-spacing:.06em;
}

.jas-footer__nav{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 42px;
}

.jas-footer__nav a{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:48px;
  border-bottom:1px solid #2c2c2c;
  color:#fff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.10em;
  transition:color .2s ease;
}

.jas-footer__nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-1px;
  height:1px;
  background:#e31967;
  transition:right .22s ease;
}

.jas-footer__nav a:hover{
  color:#fff;
}

.jas-footer__nav a:hover::after{
  right:0;
}

.jas-footer__bottom{
  display:flex;
  justify-content:space-between;
  gap:24px;
  padding-top:26px;
  border-top:1px solid #2c2c2c;
  color:#6f6f6f;
  font-size:10px;
  line-height:1.6;
  letter-spacing:.05em;
}

@media(max-width:900px){
  .jas-footer__top{
    grid-template-columns:1fr;
    gap:50px;
  }
}

@media(max-width:767px){
  .jas-footer{
    padding:56px 20px 28px;
  }

  .jas-footer__logo{
    width:min(100%,300px);
  }

  .jas-footer__nav{
    grid-template-columns:1fr;
  }

  .jas-footer__bottom{
    flex-direction:column;
    gap:8px;
  }
}

/* Footer only: white background version */
.jas-footer{
  background:#fff !important;
  color:#050505 !important;
  border-top:1px solid #d8d8d8 !important;
}

.jas-footer__logo img{
  filter:none !important;
}

.jas-footer__meta strong{
  color:#050505 !important;
}

.jas-footer__meta span,
.jas-footer__meta small{
  color:#777 !important;
}

.jas-footer__nav a{
  color:#050505 !important;
  border-bottom-color:#d9d9d9 !important;
}

.jas-footer__nav a:hover{
  color:#050505 !important;
}

.jas-footer__bottom{
  border-top-color:#d9d9d9 !important;
  color:#777 !important;
}


/* =========================================================
   FV responsive art direction v4
   人物がブラウザ比率によって切れないよう、構図だけをレスポンシブ制御。
   ========================================================= */

/* 通常PC：男性側（画像右端）を必ず保持し、余白側を優先してクロップ */
@media (min-width:1200px) and (min-aspect-ratio:4/3){
  .hero .visual img{
    object-fit:cover;
    object-position:right center;
  }
}

/* ミドル幅・縦長ブラウザ：人物2名が収まる縦構図画像を使用 */
@media (min-width:768px) and (max-width:1199px),
       (min-width:768px) and (max-aspect-ratio:4/3){
  .hero .visual img{
    object-fit:cover;
    object-position:center 30%;
  }
}

/* 極端に横長で高さが低いウィンドウでは全体を保持 */
@media (min-width:1200px) and (min-aspect-ratio:2/1){
  .hero .visual img{
    object-fit:contain;
    object-position:right center;
  }
}