/* =========================================================================
   銀河 — Design F  "COSMIC NIGHT"  (dark starfield base, recolorable)
   Loaded AFTER design-d.css + design-e.css. Extends the bottom CTA's
   night-sky atmosphere (deep gradient + stars + glowing planet) across the
   WHOLE page, keeping 案E's airy whitespace layout. The color味 is driven by
   CSS vars so the page can flip between dramatically different colorways
   (body class: default=Violet / cw-indigo / cw-magenta / cw-aurora).
   ========================================================================= */

/* ---------------- COLORWAYS ---------------- */
body.d{                              /* default — VIOLET GALAXY */
  --cos-bg1:#241248; --cos-bg2:#1a0f38; --cos-bg3:#0e0922;
  --cos-neb1:rgba(150,99,255,.28); --cos-neb2:rgba(95,120,255,.22);
  --cos-planet:rgba(185,140,255,.55);
  --cos-accent:#b794ff; --cos-accent2:#7be0ff; --cos-gold:#FFD86B;
  --cos-ink:#f1ecff; --cos-sub:rgba(231,224,255,.74);
  --cos-card:rgba(255,255,255,.065); --cos-cardbd:rgba(255,255,255,.14);
  --cos-glass:rgba(20,14,46,.55);
}
body.d.cw-indigo{                    /* DEEP INDIGO / BLUE */
  --cos-bg1:#102a52; --cos-bg2:#0c1d3e; --cos-bg3:#060f24;
  --cos-neb1:rgba(91,194,217,.26); --cos-neb2:rgba(99,140,255,.22);
  --cos-planet:rgba(123,224,255,.5);
  --cos-accent:#67d3ec; --cos-accent2:#8fb4ff; --cos-gold:#FFD86B;
  --cos-ink:#e9f4ff; --cos-sub:rgba(220,234,255,.74);
  --cos-card:rgba(255,255,255,.06); --cos-cardbd:rgba(255,255,255,.14);
  --cos-glass:rgba(8,22,44,.55);
}
body.d.cw-magenta{                   /* MAGENTA / BERRY NEBULA */
  --cos-bg1:#4a1340; --cos-bg2:#330d33; --cos-bg3:#1c0820;
  --cos-neb1:rgba(255,110,180,.26); --cos-neb2:rgba(150,80,220,.22);
  --cos-planet:rgba(255,150,200,.55);
  --cos-accent:#ff8ec6; --cos-accent2:#c79bff; --cos-gold:#FFD86B;
  --cos-ink:#ffeaf6; --cos-sub:rgba(255,224,240,.76);
  --cos-card:rgba(255,255,255,.065); --cos-cardbd:rgba(255,255,255,.15);
  --cos-glass:rgba(40,12,40,.55);
}
body.d.cw-aurora{                    /* AURORA — brand teal/emerald night */
  --cos-bg1:#0c3b39; --cos-bg2:#08302f; --cos-bg3:#04201f;
  --cos-neb1:rgba(91,194,217,.26); --cos-neb2:rgba(100,192,171,.24);
  --cos-planet:rgba(143,224,239,.55);
  --cos-accent:#5BC2D9; --cos-accent2:#64C0AB; --cos-gold:#FFD86B;
  --cos-ink:#e6fbff; --cos-sub:rgba(214,244,247,.76);
  --cos-card:rgba(255,255,255,.06); --cos-cardbd:rgba(255,255,255,.14);
  --cos-glass:rgba(6,32,31,.55);
}

/* ---------------- CONTINUOUS NIGHT-SKY BASE ---------------- */
body.d{
  color:var(--cos-ink);
  background:
    radial-gradient(440px 440px at 97% 7%, var(--cos-planet), transparent 70%),
    radial-gradient(1000px 760px at 8% 2%, var(--cos-neb1), transparent 60%),
    radial-gradient(1100px 900px at 94% 58%, var(--cos-neb2), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='30' cy='48' r='1.4' opacity='.7'/%3E%3Ccircle cx='210' cy='80' r='1.1' opacity='.5'/%3E%3Ccircle cx='130' cy='150' r='1.3' opacity='.6'/%3E%3Ccircle cx='270' cy='200' r='1.2' opacity='.55'/%3E%3Ccircle cx='80' cy='240' r='1.4' opacity='.6'/%3E%3Ccircle cx='180' cy='270' r='1' opacity='.45'/%3E%3Ccircle cx='60' cy='130' r='1' opacity='.4'/%3E%3C/g%3E%3Cg fill='%23FFD86B'%3E%3Ccircle cx='250' cy='44' r='1.7' opacity='.7'/%3E%3Ccircle cx='44' cy='190' r='1.5' opacity='.6'/%3E%3Ccircle cx='160' cy='40' r='1.3' opacity='.55'/%3E%3C/g%3E%3Cg fill='%23ffffff' opacity='.85'%3E%3Cpath d='M150 86c.5 3.4 2.7 5.6 6.4 6.4-3.7.8-5.9 3-6.4 6.4-.5-3.4-2.7-5.6-6.4-6.4 3.7-.8 5.9-3 6.4-6.4z'/%3E%3Cpath d='M236 150c.4 2.6 2.1 4.3 5 5-2.9.7-4.6 2.4-5 5-.4-2.6-2.1-4.3-5-5 2.9-.7 4.6-2.4 5-5z'/%3E%3C/g%3E%3C/svg%3E") repeat,
    linear-gradient(180deg, var(--cos-bg1) 0%, var(--cos-bg2) 52%, var(--cos-bg3) 100%);
  background-size:auto,auto,auto,300px 300px,cover;
  background-attachment:fixed;
}
@media(prefers-reduced-motion:no-preference){
  body.d::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='95' cy='70' r='1.2'/%3E%3Ccircle cx='205' cy='220' r='1.1'/%3E%3Ccircle cx='20' cy='250' r='1'/%3E%3C/g%3E%3C/svg%3E") repeat;
    background-size:300px 300px;opacity:0;animation:cos-twinkle 4.5s ease-in-out infinite;}
}
@keyframes cos-twinkle{0%,100%{opacity:0;}50%{opacity:.7;}}

/* dissolve all the old section color-blocks so the night sky shows through */
.d .e-sec-white,.d .e-sec-a,.d .e-sec-b,.d .e-sec-c,
.d .d-day,.d .d-support,.d .e-r2,.d .e-reasons,
.d .d-about,.d .d-work,.d .d-flow,.d .d-fac,.d .d-banners-sec,
.d .d-cta{background:transparent !important;border:none !important;}
.d .e-r2::before,.d .e-reasons::before,
.d .d-about::before,.d .d-work::before,.d .d-day::before,
.d .d-support::before,.d .d-flow::before,.d .d-fac::before{display:none !important;}

/* ---------------- AIRY RHYTHM (kept from the light version) ---------------- */
.d .section{padding:120px 0;}
.d .container{max-width:1080px;}
@media(max-width:760px){ .d .section{padding:72px 0;} }

/* ---------------- TYPOGRAPHY (ENILIS-like, now light on dark) ---------------- */
.d .d-head{text-align:left;margin-bottom:54px;max-width:760px;display:flex;flex-direction:column;}
.d .d-head .d-en{order:2;display:block;font-family:"Century Gothic","Trebuchet MS",sans-serif;
  font-weight:800;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--cos-accent);margin:14px 0 0;}
.d .d-head .d-en::before{content:"✦";margin-right:9px;color:var(--cos-gold);font-size:12px;}
.d .d-head .d-jp{order:1;font-size:clamp(30px,4.4vw,50px);font-weight:900;color:var(--cos-ink);
  line-height:1.32;letter-spacing:.02em;}
.d .d-head .d-lead{order:3;margin:22px 0 0;color:var(--cos-sub);font-size:15.5px;line-height:2.1;max-width:660px;}
.d .d-head .d-dots{order:4;margin-top:22px;}

.d .e-eyebrow{font-family:"Century Gothic","Trebuchet MS",sans-serif;color:var(--cos-accent);}
.d .e-eyebrow::before{content:"✦";width:auto;height:auto;background:none;margin-right:2px;color:var(--cos-gold);}
.d .e-teaser{gap:64px;align-items:center;}
.d .e-teaser-body h2{font-size:clamp(26px,3.4vw,40px);color:var(--cos-ink);line-height:1.4;letter-spacing:.01em;}
.d .e-teaser-body p{font-size:15.5px;line-height:2.15;color:var(--cos-sub);}
.d .mark{background:linear-gradient(transparent 58%, color-mix(in srgb, var(--cos-accent) 50%, transparent) 58%);
  padding:0 .06em;color:#fff;}
/* teammate: remove the highlight underline on section headings */
.d .e-teaser-body h2 .mark,.d .e-r2-head h2 .mark{background:none;color:inherit;padding:0;}
/* teammate: remove all 4-dot decorations across the top page */
.d .e-teaser-dots,.d .d-dots{display:none !important;}

/* ---------------- SURFACES → dark glass ---------------- */
.d .e-r2-cell,.d .e-voice,.d .e-reason-card,.d .e-stat-cell{
  background:var(--cos-card) !important;backdrop-filter:blur(10px);
  border:1px solid var(--cos-cardbd) !important;border-radius:22px !important;
  box-shadow:0 18px 44px rgba(0,0,0,.32) !important;}
.d .e-r2-cell:hover,.d .e-voice:hover,.d .e-reason-card:hover{
  transform:translateY(-5px);box-shadow:0 26px 56px rgba(0,0,0,.42) !important;
  border-color:color-mix(in srgb, var(--cos-accent) 55%, transparent) !important;}

.d .e-r2-cell h3,.d .e-voice h4{color:var(--cos-ink);}
.d .e-r2-cell p,.d .e-voice p{color:var(--cos-sub);}
.d .e-r2-cell::after{filter:none;opacity:.95;}
.d .e-voice .quote{color:color-mix(in srgb, var(--cos-accent) 60%, white);}
.d .e-voice .who{border-top-color:rgba(255,255,255,.16);}
.d .e-voice .who .av{background:color-mix(in srgb, var(--cos-accent) 22%, transparent);}
.d .e-voice .who .av img{filter:brightness(0) invert(1);}
.d .e-voice .who b{color:var(--cos-ink);}
.d .e-voice .who span{color:var(--cos-sub);}

/* numbers in the accent (glow removed) */
.d .e-r2-cell .e-num{color:var(--cos-accent) !important;text-shadow:none;}
.d .e-r2-cell:nth-child(2) .e-num{color:var(--cos-accent2) !important;}
.d .e-r2-cell:nth-child(3) .e-num{color:var(--cos-gold) !important;}
.d .e-r2-head{text-align:left;margin-bottom:40px;}
.d .e-r2-head .d-en{color:var(--cos-accent);}
.d .e-r2-head .d-en::before{content:"✦";margin-right:9px;color:var(--cos-gold);}
.d .e-r2-head h2{font-size:clamp(26px,3.6vw,42px);color:var(--cos-ink);}

/* reason-card icon tiles + nums */
.d .e-reason-ico{background:color-mix(in srgb, var(--cos-accent) 18%, transparent);border-color:rgba(255,255,255,.18);}
.d .e-reason-ico img{filter:brightness(0) invert(1);}
.d .e-reason-num{color:var(--cos-accent);}
.d .e-reason-card h3{color:var(--cos-ink);}
.d .e-reason-card p{color:var(--cos-sub);}
.d .e-stat-cell b{color:var(--cos-accent);}
.d .e-stat-cell span{color:var(--cos-sub);}

/* media frames */
.d .e-teaser-media .one{border:1px solid var(--cos-cardbd);border-radius:24px;box-shadow:0 26px 60px rgba(0,0,0,.45);}
.d .e-teaser-thumbs figure{border:1px solid var(--cos-cardbd);border-radius:18px;box-shadow:0 16px 40px rgba(0,0,0,.4);}
.d .e-teaser-thumbs figcaption{background:var(--cos-glass);color:var(--cos-ink);backdrop-filter:blur(6px);}
.d .map-ph{background:var(--cos-card);border:1.5px dashed color-mix(in srgb,var(--cos-accent) 55%,transparent);
  border-radius:24px;backdrop-filter:blur(6px);}
.d .map-ph .map-big{color:var(--cos-ink);}
.d .map-ph .map-illust path{fill:var(--cos-accent);}
.d .map-ph .map-cap{color:var(--cos-accent2);}
.d .map-ph .map-note{background:var(--cos-glass);color:var(--cos-ink);}
.d .map-ph .pin{background:var(--cos-accent);box-shadow:0 0 12px var(--cos-accent);}
.d .map-ph .pin::after{background:var(--cos-bg2);}

/* dots keep the multi-color brand pop */

/* "詳しく見る" pill — bright accent on dark */
.d .e-detail{background:var(--cos-accent);color:#10122b;border-radius:14px;white-space:nowrap;font-weight:900;}
.d .e-detail .arw{background:rgba(0,0,0,.22);color:#fff;}
.d .e-detail:hover{box-shadow:0 8px 0 color-mix(in srgb,var(--cos-accent) 45%, black);}
.d .e-detail.on-dark{background:#fff;color:#10122b;}

/* ---------------- HERO panel → dark glass over the photo ---------------- */
.d .e-hero{background:var(--cos-bg3);}
.d .e-hero::after{height:140px;background:linear-gradient(180deg,transparent,var(--cos-bg1));}
.d .e-hero-panel{background:var(--cos-glass) !important;backdrop-filter:blur(14px);
  border:1px solid var(--cos-cardbd) !important;box-shadow:0 26px 60px rgba(0,0,0,.5) !important;}
.d .e-hero-panel::before{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cos-accent) 30%,transparent) !important;}
.d .e-hero-eyebrow{background:var(--cos-accent);color:#10122b;box-shadow:0 6px 18px rgba(0,0,0,.4);}
/* 2-line eyebrow: 神奈川県密着 / 就労継続支援B型事業所 */
.d .e-hero-eyebrow.eb-2{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;
  line-height:1.25;padding:8px 14px;border-radius:12px;}
.d .e-hero-eyebrow.eb-2 b{font-size:11px;font-weight:800;letter-spacing:.12em;opacity:.85;}
.d .e-hero-eyebrow.eb-2 i{font-style:normal;font-size:15px;font-weight:900;letter-spacing:.02em;}
.d .e-hero-panel h1{color:var(--cos-ink);}
/* make the FV headline more prominent */
.d .e-hero-panel h1{font-size:clamp(31px,3.6vw,46px) !important;font-weight:900;line-height:1.44;
  letter-spacing:.01em;text-shadow:0 2px 24px rgba(0,0,0,.4);}
.d .e-hero-panel{padding:30px 30px 28px;}
/* teammate: remove the two rotating orbit-ring "planet" decorations in the FV */
.d .d-orbit{display:none !important;}
.d .e-hero-panel h1 .mark-em{background:linear-gradient(transparent 56%, var(--cos-gold) 56%);color:#1a1430;}
.d .e-hero-panel .e-lead{color:var(--cos-sub);}
.d .e-hero-trust .chip{background:color-mix(in srgb,var(--cos-accent) 18%, transparent);color:var(--cos-ink);
  border:1px solid var(--cos-cardbd);}
.d .e-hero-cta .btn-ghost{background:transparent !important;color:var(--cos-ink) !important;
  box-shadow:inset 0 0 0 2px var(--cos-cardbd) !important;}

/* ---------------- BUTTONS ---------------- */
.d .btn-primary{background:var(--cos-accent);color:#10122b;box-shadow:0 12px 28px rgba(0,0,0,.4);}
.d .btn-primary:hover{background:color-mix(in srgb,var(--cos-accent) 80%, white);}
.d .nav-cta .btn-primary img{filter:none;}

/* ---------------- GROUP — dark glass card ---------------- */
.d .d-group{background:var(--cos-card) !important;backdrop-filter:blur(10px);
  border:1px solid var(--cos-cardbd);border-radius:30px;color:var(--cos-ink);
  box-shadow:0 24px 60px rgba(0,0,0,.4);}
.d .d-group::after{opacity:.05;filter:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0c1 6 5 10 12 12-7 2-11 6-12 12-1-6-5-10-12-12 7-2 11-6 12-12z' fill='%23ffffff'/%3E%3C/svg%3E");}
.d .d-group .gl .ge{color:var(--cos-accent);}
.d .d-group .gl h3{color:var(--cos-ink);}
.d .d-group .gl p{color:var(--cos-sub);}
.d .d-group .gl p b{color:#fff !important;}
.d .e-domains{border-color:rgba(255,255,255,.16);}
.d .gdomain{border-color:rgba(255,255,255,.14);}
.d .gdomain .gd-ico{background:color-mix(in srgb,var(--cos-accent) 20%, transparent);}
.d .gdomain .gd-ico img{filter:brightness(0) invert(1);}
.d .gdomain b{color:var(--cos-ink);}

/* ---------------- CTA — focal night panel ---------------- */
.d .d-cta-inner{background:var(--cos-glass);backdrop-filter:blur(12px);
  border:1px solid var(--cos-cardbd);border-radius:34px;padding:64px 56px;
  box-shadow:0 30px 70px rgba(0,0,0,.5);max-width:840px;}
.d .d-cta .d-en{color:var(--cos-accent);text-align:center;display:block;}
.d .d-cta .d-en::before{content:"✦";margin-right:8px;color:var(--cos-gold);}
.d .d-cta h2{color:var(--cos-ink);}
.d .d-cta p{color:var(--cos-sub);}
.d .d-cta .btn-white{background:#fff;color:#16182e;box-shadow:0 12px 26px rgba(0,0,0,.4);}
.d .d-cta .btn-ghost{color:var(--cos-ink) !important;box-shadow:inset 0 0 0 2px var(--cos-cardbd) !important;}
.d .d-cta-contact a{color:var(--cos-ink);}
.d .d-cta-contact a .ci{background:color-mix(in srgb,var(--cos-accent) 20%, transparent);}
.d .d-cta-contact a .ci img{filter:brightness(0) invert(1);}
@media(max-width:760px){ .d .d-cta-inner{padding:42px 24px;} }

/* ---------------- HEADER / FOOTER ---------------- */
.d .site-header{background:color-mix(in srgb, var(--cos-bg2) 78%, transparent);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.1);}
.d .nav-links a{color:var(--cos-ink);}
.d .nav-links a:hover{color:var(--cos-accent);}
.d .nav-tel{color:var(--cos-accent);}
.d .nav-burger i{background:var(--cos-ink);}
.d .nav-logo{filter:brightness(0) invert(1);opacity:.96;}
.d .mnav{background:color-mix(in srgb, var(--cos-bg2) 94%, transparent);}
.d .mnav a{color:var(--cos-ink);border-bottom-color:rgba(255,255,255,.12);}
.d .mnav .x{color:var(--cos-ink);}
.d .site-footer{background:rgba(0,0,0,.32);backdrop-filter:blur(8px);border-top:1px solid rgba(255,255,255,.1);}

/* ---------------- COLORWAY SWITCHER UI ---------------- */
.cw-switcher{position:fixed;left:16px;bottom:16px;z-index:300;display:flex;align-items:center;gap:6px;
  background:rgba(12,14,30,.7);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.16);
  padding:7px 8px;border-radius:999px;box-shadow:0 12px 30px rgba(0,0,0,.4);}
.cw-switcher .cw-lbl{font-size:11px;font-weight:800;color:rgba(255,255,255,.65);padding:0 6px 0 8px;white-space:nowrap;}
.cw-switcher button{border:none;cursor:pointer;width:26px;height:26px;border-radius:50%;padding:0;
  outline:2px solid transparent;outline-offset:2px;transition:transform .15s,outline-color .15s;}
.cw-switcher button:hover{transform:scale(1.12);}
.cw-switcher button.active{outline-color:#fff;}
.cw-sw-violet{background:linear-gradient(135deg,#b794ff,#7be0ff);}
.cw-sw-indigo{background:linear-gradient(135deg,#67d3ec,#8fb4ff);}
.cw-sw-magenta{background:linear-gradient(135deg,#ff8ec6,#c79bff);}
.cw-sw-aurora{background:linear-gradient(135deg,#5BC2D9,#64C0AB);}
@media(max-width:560px){ .cw-switcher .cw-lbl{display:none;} .cw-switcher{left:10px;bottom:74px;} }