/* HOSHIAI brand layer. Existing page behavior and service content remain in styles.css. */
:root{
  --paper:#faf8f4;
  --white:#fff;
  --ink:#27384a;
  --blue:#435a6d;
  --muted:#5d6c79;
  --line:#d9dedb;
  --sand:#f0eee9;
  --signal:#9b624a;
  --night:#344b5d;
  --night-deep:#293e50;
  --night-soft:#536a79;
  --warm:#faf3eb;
  --brand-ease:cubic-bezier(.22,.8,.2,1);
}
body{background:var(--paper);color:var(--ink)}
::selection{background:#dec0a7;color:#27384a}
:focus-visible{outline-color:var(--signal)}
.eyebrow{font-size:12px;letter-spacing:.14em;color:#526572}
.eyebrow>span{background:var(--signal)}
h1,h2,h3{letter-spacing:-.025em}
h2{font-size:clamp(30px,3.2vw,44px);line-height:1.55}
.section{padding-block:clamp(76px,8vw,124px)}
.text-link,.origin-next{transition:color .2s ease,gap .2s ease}
.text-link:hover,.origin-next:hover{color:var(--signal);gap:25px}

/* The logo is a supplied, approved brand export rather than typeset HTML. */
.header{height:88px;background:rgba(250,248,244,.96);border-bottom:1px solid #e2e3df;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{display:inline-flex;gap:0;align-items:center}
.brand img{width:176px;height:auto;max-height:50px;object-fit:contain;mix-blend-mode:normal}
.header nav{gap:clamp(12px,2vw,27px);font-size:12px;color:#34495b}
.header nav>a{transition:color .2s ease}
.header nav>a:hover{color:#965938}
.header .nav-contact{background:var(--night);border:1px solid var(--night);color:#fff;padding:10px 19px;min-width:119px;justify-content:space-between;transition:background .2s ease,border-color .2s ease,transform .2s ease}
.header .nav-contact:hover{color:#fff;background:#486173;border-color:#486173;transform:translateY(-2px)}

/* The star path and the real storefront share a frame: technology remains connected to the field. */
.hoshiai-hero.wrap{width:min(1440px,calc(100% - 40px));max-width:none;min-height:720px;display:grid;grid-template-columns:1.02fr .98fr;gap:4vw;align-items:center;position:relative;overflow:hidden;background:#f2f0eb;color:var(--ink);padding:clamp(52px,6vw,88px) clamp(40px,5.5vw,82px) 86px;margin-top:20px;border-radius:22px}
.hoshiai-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(117deg,#f5f3ee 2%,#edf0ee 62%,#e8edec 100%);pointer-events:none}
.hoshiai-hero:after{content:"";position:absolute;top:-1px;right:13%;width:36%;height:1px;background:#b48062;box-shadow:0 0 19px 2px #b4806240;opacity:.6}
.hero-constellation{position:absolute;inset:0;pointer-events:none;opacity:.54}
.hero-constellation svg{position:absolute;right:-11%;top:-6%;width:67%;height:110%;fill:none}
.hero-constellation path{stroke:#8197a2;stroke-width:.8;opacity:.22}
.hero-constellation circle{fill:#b88060;filter:drop-shadow(0 0 5px #b8806080);opacity:.8}
.hoshiai-hero .hero-copy,.hoshiai-hero .hero-visual{position:relative;z-index:1}
.hoshiai-hero .hero-copy{max-width:615px;align-self:center;padding-bottom:14px}
.hero-kicker{display:flex;align-items:center;gap:12px;color:#935d44;letter-spacing:.12em;font-size:11px;font-weight:600;margin-bottom:32px}
.hero-kicker-star{font-size:20px;line-height:1;color:var(--signal)}
.hero-overline{font-family:Arial,sans-serif;font-size:11px;letter-spacing:.26em;color:#687b86;margin-bottom:15px}
.hoshiai-hero h1{font-size:clamp(38px,4.3vw,68px);line-height:1.48;letter-spacing:-.065em;font-weight:600;white-space:normal;text-wrap:balance}
.hero-shine{color:#a76143}
.hero-period{color:#344b5d}
.hoshiai-hero .hero-description{color:#50616e;font-size:clamp(14px,1.2vw,16px);line-height:2.15;margin-top:30px}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px 27px;margin-top:28px}
.hoshiai-hero .primary{background:var(--night);color:#fff;margin-top:0;min-height:58px;box-shadow:0 10px 22px #344b5d24;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
.hoshiai-hero .primary:hover{background:#496475;transform:translateY(-3px);box-shadow:0 12px 24px #344b5d32}
.hero-story-link{display:inline-flex;align-items:center;gap:13px;color:#3c5261;font-size:12px;padding:12px 0;border-bottom:1px solid #9ba9ae;transition:color .2s ease,border-color .2s ease}
.hero-story-link:hover{color:#965938;border-color:#965938}
.hoshiai-hero .cta-note{color:#64737d;font-size:11px;line-height:1.7;margin-top:20px}
.hoshiai-hero .hero-visual{height:590px;min-width:0;padding:0;display:flex;align-items:center;justify-content:center;perspective:1000px}
.hero-photo-frame{position:absolute;inset:22px 15px 20px 63px;border:1px solid #aab7b7;border-radius:224px 224px 16px 16px;padding:11px}
.hoshiai-hero .hero-main{position:relative;inset:auto;width:100%;height:100%;overflow:hidden;border-radius:214px 214px 8px 8px;background:#536580}
.hoshiai-hero .hero-main img{width:100%;height:100%;object-fit:cover;object-position:51% 48%;border-radius:0;filter:saturate(.84) contrast(1.02)}
.hoshiai-hero .hero-main:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#13244c22 50%,#101b3da8 100%);pointer-events:none}
.hoshiai-hero .hero-main figcaption{top:auto;bottom:18px;right:20px;z-index:1;writing-mode:horizontal-tb;color:#fff;font-size:11px;letter-spacing:.08em}
.hoshiai-hero .hero-inset{position:absolute;left:0;bottom:2px;width:31%;min-width:145px;border:7px solid #f2f0eb;border-radius:9px;background:#f2f0eb;box-shadow:0 14px 28px #344b5d38;z-index:2}
.hoshiai-hero .hero-inset img{height:155px;object-fit:cover;border-radius:3px}
.hoshiai-hero .hero-inset figcaption{background:#f2f0eb;color:#344b5d;padding:7px 0 1px;font-size:10px}
.hero-signal{position:absolute;right:-2px;bottom:44px;z-index:3;display:flex;align-items:center;gap:10px;background:var(--warm);color:var(--night);padding:15px 19px;border-radius:8px;box-shadow:0 16px 36px #050d2b45;font-size:12px;line-height:1.6;font-weight:700}
.signal-dot{width:8px;height:8px;background:var(--signal);border-radius:50%;box-shadow:0 0 0 5px #ec7a2c2b}
.signal-arrow{font-size:17px;color:#de7229;margin-left:13px}
.hero-orbit{position:absolute;top:0;right:-12px;width:88px;height:88px;border:1px solid #c7d0cc;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:5px;color:#344b5d;font:600 13px Arial,sans-serif;letter-spacing:.03em;background:#f8f7f1e8}
.hero-orbit i{display:block;width:4px;height:4px;background:var(--signal);border-radius:50%;box-shadow:0 0 0 4px #ec7a2c30}
.hero-orbit b{font-weight:600;color:#a76143}
.hero-bottomline{position:absolute;left:clamp(40px,5.5vw,82px);right:clamp(40px,5.5vw,82px);bottom:27px;z-index:1;display:flex;justify-content:space-between;gap:12px;border-top:1px solid #bdc8c8;padding-top:14px;color:#647985;font:10px Arial,sans-serif;letter-spacing:.16em}

.field-strip{margin-top:28px;background:#fff;box-shadow:0 7px 28px #1824420a;border:1px solid #e3e6eb;border-radius:8px;padding:27px 34px}
.field-strip>div{border-color:#d6dce5}
.number{font:500 66px/1 Arial,sans-serif;color:#8f725d}
.approach{padding-top:120px}
.approach h2{max-width:560px}
.closing-line{border-color:var(--signal)}

/* A single signature scene: two stars meet, then the line settles. */
.origin{background:#f3f2ee;overflow:hidden}
.origin-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:clamp(50px,6vw,110px)}
.origin-art{height:550px;position:relative;background:var(--night);border-radius:14px;overflow:hidden;box-shadow:0 22px 42px #344b5d24}
.origin-art:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#3d5466,#455e70 57%,#354e60);pointer-events:none}
.origin-art:after{content:"";position:absolute;inset:18px;border:1px solid #a7b6d433;border-radius:6px;pointer-events:none}
.origin-network{position:absolute;inset:0;width:100%;height:100%;fill:none}
.origin-guide{stroke:#8eabd9;stroke-width:1;opacity:.22}
.origin-node{fill:#e8efff;opacity:.8}
.origin-line{stroke:#dfaa85;stroke-width:2.5;stroke-linecap:round;filter:drop-shadow(0 0 5px #dfaa8580)}
.origin-star{fill:#e7b28e;filter:drop-shadow(0 0 6px #e7b28e)}
.origin-art img{position:absolute;left:50%;top:50%;width:133px;height:133px;object-fit:contain;transform:translate(-50%,-50%);filter:drop-shadow(0 20px 22px #050c24b5)}
.origin-coordinate,.origin-art-number{position:absolute;z-index:2;color:#bfcae5;font:10px Arial,sans-serif;letter-spacing:.14em}
.origin-coordinate{top:36px;left:35px}.origin-art-number{right:34px;bottom:28px}
.origin-art-label{position:absolute;z-index:2;color:#fff;font:600 16px Arial,sans-serif;letter-spacing:.16em}
.origin-art-label small{font:11px var(--font);letter-spacing:.08em;color:#cfdaec}
.origin-art-label-a{left:12%;bottom:20%}.origin-art-label-b{right:11%;top:22%}
.origin-copy .eyebrow{color:#5e6d8a}
.origin-copy h2{font-size:clamp(31px,3.4vw,48px);line-height:1.55;letter-spacing:-.04em;margin-bottom:30px}
.origin-copy h2 em{font-style:normal;color:#a76143}
.origin-copy>p:not(.eyebrow){font-size:14px;line-height:2.05;color:#465676;max-width:580px;margin-top:20px}
.origin-copy blockquote{margin:30px 0;padding:19px 0 19px 24px;border-left:2px solid var(--signal);font-size:clamp(19px,2vw,25px);line-height:1.7;font-weight:600;letter-spacing:-.02em;color:var(--night)}
.origin-next{display:inline-flex;align-items:center;gap:16px;margin-top:26px;padding-bottom:8px;border-bottom:1px solid #7e8ba4;color:var(--night);font-size:12px;font-weight:600}

.services{background:#fff}
.services .service-row{border-color:#d8dde7}
.services .service-no{color:#866b56;font:600 20px/2 Arial,sans-serif}
.services .service-label{color:#66728a}
.services .service-name h3{color:var(--night)}
.services details[open] summary{color:#965938}
.services .detail-content{border-color:#d8dde7}

.ai-workbench{background:var(--night);color:#f5f7f4;--cyan:#ca9575}
.ai-workbench:before{content:"";position:absolute;right:-140px;top:-250px;width:620px;height:620px;border:1px solid #99acd436;border-radius:50%;box-shadow:0 0 0 74px #9aaed209,0 0 0 150px #9aaed208;pointer-events:none}
.ai-workbench .section-heading,.ai-workbench>.wrap{position:relative}
.ai-workbench .eyebrow{color:#e2b393}
.ai-workbench .section-heading h2,.ai-workbench .section-heading p{color:#f5f7f4}
.ai-workbench .section-heading h2 em{color:#e7b899}
.ai-workbench .work-choice{background:#4c6272;color:#f7f8f4;border:1px solid #8193a0;border-radius:120px 120px 10px 10px;box-shadow:none;transform:none}
.ai-workbench .work-choice:hover{border-color:#cfaa90;background:#536d7b;transform:translateY(-3px)}
.ai-workbench .work-choice.active{background:#f6f4ef;color:var(--night);border-color:#c49b7e;box-shadow:0 12px 25px #1d2b383d;transform:translateY(-8px)}
.ai-workbench .work-choice.active .staff-select-label{color:#b4571d}
.ai-workbench .work-stage{background:#faf8f4;color:var(--night);border:1px solid #c8d2d1;border-radius:12px;background-image:none;box-shadow:0 22px 38px #1d2b3838}
.ai-workbench .work-note,.ai-workbench>.wrap>.text-link{color:#d8e1f3}
.ai-workbench .staff-number{color:inherit}
.ai-workbench .staff-at-work .eyebrow{color:#b65c24}
.ai-workbench .meeting-steps button.selected{background:var(--night);border-color:var(--night);color:#fff}
.ai-workbench .example-tag{color:#bf6127}

.stores{background:#faf8f4}
.store-grid img{border-radius:7px;filter:saturate(.9)}
.message{background:#f0f0eb}
.message .signature strong{color:var(--night)}
.company-facts{border-color:#ced5e2}
.company-facts dl div{border-color:#d4dae6}
.faq{background:#fff}
.journal{background:#faf8f4}
.journal .journal-grid{border-color:#d7dce4}
.journal .journal-card:hover h3{color:#bf5d21}
.journal .journal-meta{color:#7b5f50}
.journal .journal-read{color:#a34e1e}
.contact{background:var(--night);color:#fff}
.contact .eyebrow{color:#e2b393}
.contact .contact-form{background:#faf8f4;border:1px solid #d7ddda;border-radius:12px;box-shadow:0 22px 38px #1d2b383a}
.contact-form .form-submit{background:var(--night);color:#fff;font-weight:700}
.contact-form .form-submit:hover{background:#496475}
.contact-form .contact-note,.contact-form .contact-note a{color:#53617a}
.footer{border-top:1px solid #dfe3e9}
.footer .brand img{width:168px;height:auto}
.footer-legal{display:block;margin-top:5px;color:#68758a;font-size:10px;letter-spacing:0}
.motion-control{background:#fff;color:var(--night);border-color:#cbd2dd}

/* Subpages use the same visual language while keeping long legal/news text quiet. */
.subpage{background:var(--paper)}
.subpage .page-title{color:var(--night)}
.subpage .eyebrow{color:#965938}
.article-body a{color:#965938}

@keyframes star-arrive{from{opacity:.35;transform:translate(-50%,-50%) scale(.92)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes line-meet{from{stroke-dashoffset:800}to{stroke-dashoffset:0}}
@keyframes point-in{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}
.motion-ready:not(.motion-paused) .origin.is-inview .origin-line{stroke-dasharray:800;animation:line-meet 1.55s var(--brand-ease) .15s both}
.motion-ready:not(.motion-paused) .origin.is-inview .origin-star{animation:point-in .5s var(--brand-ease) 1.1s both;transform-origin:center}
.motion-ready:not(.motion-paused) .origin.is-inview .origin-art img{animation:star-arrive .7s var(--brand-ease) .55s both}
.motion-ready:not(.motion-paused) .hero-constellation circle{animation:point-in .85s var(--brand-ease) both;transform-origin:center}
.motion-ready:not(.motion-paused) .hero-constellation circle:nth-of-type(2){animation-delay:.12s}
.motion-ready:not(.motion-paused) .hero-constellation circle:nth-of-type(3){animation-delay:.25s}

@media(max-width:1100px){
  .header{padding-inline:30px}
  .header nav{gap:14px;font-size:11px}
  .brand img{width:151px}
  .hoshiai-hero.wrap{gap:24px;padding-inline:48px;min-height:650px}
  .hoshiai-hero h1{font-size:clamp(34px,4.5vw,55px)}
  .hoshiai-hero .hero-visual{height:530px}
  .origin-grid{gap:50px}
  .origin-art{height:500px}
}
@media(max-width:900px){
  .header{height:72px;padding-inline:20px}
  .brand img{width:147px;max-height:43px}
  .header nav{background:#faf8f4;border-color:#d8deea;color:var(--night)}
  .header .nav-contact{justify-content:center}
  .hoshiai-hero.wrap{display:flex;flex-direction:column;width:calc(100% - 28px);gap:18px;padding:52px 34px 76px;min-height:0;margin-top:14px;border-radius:15px}
  .hoshiai-hero .hero-copy{width:100%;max-width:none;padding:0}
  .hoshiai-hero h1{font-size:clamp(39px,7vw,59px);line-height:1.45}
  .hoshiai-hero .hero-visual{width:min(100%,550px);height:480px;align-self:center}
  .hero-photo-frame{inset:18px 20px 20px 54px}
  .hero-constellation svg{top:0;right:-35%;width:115%;height:100%}
  .hero-bottomline{left:34px;right:34px}
  .hero-bottomline span:nth-child(3){display:none}
  .origin-grid{grid-template-columns:1fr;gap:40px}
  .origin-art{height:440px;max-width:600px;width:100%;margin-inline:auto}
  .origin-copy{max-width:680px;margin-inline:auto}
  .ai-workbench .work-choice{border-radius:95px 95px 10px 10px}
}
@media(max-width:600px){
  .section{padding-block:76px}
  .hoshiai-hero.wrap{width:100%;margin-top:0;border-radius:0;padding:42px 20px 58px}
  .hero-kicker{font-size:10px;margin-bottom:21px}
  .hero-overline{font-size:10px;margin-bottom:11px}
  .hoshiai-hero h1{font-size:clamp(38px,10vw,52px);line-height:1.48;white-space:normal}
  .hoshiai-hero .hero-description{font-size:14px;line-height:2;margin-top:20px}
  .hero-actions{gap:12px 20px;margin-top:25px}
  .hoshiai-hero .primary{width:100%;max-width:350px;justify-content:space-between}
  .hero-story-link{font-size:11px}
  .hoshiai-hero .hero-visual{height:360px;max-width:430px;margin-top:7px}
  .hero-photo-frame{inset:13px 20px 24px 45px;padding:6px;border-radius:154px 154px 10px 10px}
  .hoshiai-hero .hero-main{border-radius:150px 150px 5px 5px}
  .hoshiai-hero .hero-inset{min-width:0;width:30%;left:0;bottom:7px;border-width:4px}
  .hoshiai-hero .hero-inset img{height:93px}
  .hoshiai-hero .hero-inset figcaption{font-size:9px}
  .hero-signal{right:0;bottom:35px;padding:10px 11px;font-size:10px;gap:7px}
  .signal-arrow{margin-left:1px}
  .hero-orbit{width:58px;height:58px;right:0;top:-5px;font-size:10px}
  .hero-bottomline{left:20px;right:20px;bottom:18px;font-size:8px}
  .field-strip{width:calc(100% - 36px);margin-top:20px;padding:20px 18px;gap:15px}
  .field-strip>div{padding-inline:12px}
  .number{font-size:50px}
  .approach{padding-top:76px}
  .origin-art{height:390px}
  .origin-art img{width:104px;height:104px}
  .origin-art-label{font-size:13px}
  .origin-art-label small{font-size:10px}
  .origin-coordinate{top:27px;left:27px;font-size:8px}
  .origin-art-number{right:27px;bottom:21px}
  .origin-copy h2{font-size:clamp(29px,8vw,39px)}
  .origin-copy>p:not(.eyebrow){font-size:13px}
  .origin-copy blockquote{font-size:20px}
  .ai-workbench:before{right:-270px;top:-350px}
  .ai-workbench .work-choice{border-radius:80px 80px 9px 9px;padding:17px 6px 12px}
  .ai-workbench .work-choice.active{transform:translateY(-4px)}
  .contact .contact-form{padding:23px 19px}
  .footer .brand img{width:150px}
}
@media(prefers-reduced-motion:reduce){
  .origin-line,.origin-star,.origin-art img,.hero-constellation circle{animation:none!important}
  .header .nav-contact,.hoshiai-hero .primary,.hero-story-link{transition:none}
}
@media(max-width:600px){
  .motion-control{right:8px;bottom:8px;padding:7px 9px;font-size:10px;min-height:32px;opacity:.88}
}
.contact .cta-note.light{display:block;background:none;color:#e7c8af;padding:0;margin-top:18px;box-shadow:none;font-size:12px;line-height:1.8}
.hoshiai-hero .hero-main img{filter:saturate(.91) contrast(1.03) brightness(1.08)}
.hoshiai-hero .hero-main:after{background:linear-gradient(180deg,transparent 56%,#293e5063 100%)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.not-found{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(35px,6vw,100px);align-items:center;min-height:70vh}
.not-found-art{height:380px;background:var(--night);border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px;color:#f6f8ff;font:600 clamp(80px,10vw,160px) Arial,sans-serif}
.not-found-art img{width:clamp(90px,12vw,165px);height:auto}
.not-found .primary{background:var(--night);color:#fff}
@media(max-width:900px){.not-found{grid-template-columns:1fr;min-height:0}.not-found-art{height:260px}.not-found-art img{width:112px}}