/* v10.10 ── この行があれば最新版です */
/* BULL SPA ── 全ページ共通 */
/* TeX Gyre Adventor ── ITC Avant Garde Gothic のオープンソース版（GUST Font License） */
@font-face{font-family:"TG Adventor";src:url("../fonts/texgyreadventor-regular.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"TG Adventor";src:url("../fonts/texgyreadventor-bold.woff2") format("woff2");
  font-weight:700;font-style:normal;font-display:swap}

/* ================= tokens ================= */
:root{
  --ink:#14101A;      /* 夜のインク：黒ではなく、紫を含んだ闇 */
  --ink-2:#1C1622;
  --ink-3:#241C2C;
  --ivory:#EFE7DC;
  --smoke:#9A8FA0;
  --amber:#E3AE6A;    /* いま・営業中・BULL */
  --plum:#7A4A69;
  --london:#6C5B7B;   /* ロンドン */
  --ny:#4E6E7A;       /* ニューヨーク */
  --line:rgba(239,231,220,.14);

  --disp:"Shippori Mincho",serif;
  --lat:"TG Adventor","ITC Avant Garde Gothic","Century Gothic","URW Gothic",sans-serif;
  --body:"Zen Kaku Gothic New",sans-serif;

  --pad:clamp(20px,5vw,72px);
  --sec:clamp(88px,11vw,168px);
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--ivory);font-family:var(--body);font-weight:300;
  line-height:1.95;letter-spacing:.05em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--amber);outline-offset:4px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:var(--pad)}
.grain{position:fixed;inset:0;z-index:9;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* ================= header ================= */
.hd{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:14px var(--pad);transition:background .5s var(--ease),backdrop-filter .5s var(--ease),padding .5s var(--ease)}
.hd.is-stuck{background:rgba(20,16,26,.85);backdrop-filter:blur(14px);padding-block:9px;border-bottom:1px solid var(--line)}
.hd.is-stuck .hd__mark{padding-bottom:7px}
/* ---- ロゴタイプ：BULL（アイボリー）＋ SPA（アンバー）／縦罫で和文／下線が伸びる ---- */
.hd__mark{position:relative;display:flex;align-items:center;gap:16px;padding-bottom:9px}
.hd__mark b{font-family:var(--lat);font-weight:400;font-size:1.06rem;letter-spacing:.3em;
  line-height:1;white-space:nowrap;margin-right:-.3em}
.hd__mark b em{font-style:normal;color:var(--amber);transition:color .4s var(--ease)}
.hd__mark i{font-style:normal;font-family:var(--disp);font-size:.62rem;color:var(--smoke);
  letter-spacing:.22em;line-height:1.6;white-space:nowrap;
  border-left:1px solid var(--line);padding-left:16px;transition:border-color .5s var(--ease)}
.hd__mark::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--amber);transform:scaleX(0);transform-origin:left;
  transition:transform .75s var(--ease)}
.hd__mark:hover::after,.hd__mark:focus-visible::after{transform:scaleX(1)}
.hd__mark:hover i{border-color:rgba(227,174,106,.4)}
.hd__right{display:flex;align-items:center;gap:clamp(12px,2vw,26px)}
.pill{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:100px;
  padding:7px 16px 7px 13px;font-size:.68rem;letter-spacing:.16em;color:var(--smoke);white-space:nowrap}
.pill i{width:6px;height:6px;border-radius:50%;background:var(--smoke);flex:none}
.pill.is-open{color:var(--amber);border-color:rgba(227,174,106,.4)}
.pill.is-open i{background:var(--amber);animation:beat 2.4s infinite}
@keyframes beat{0%{box-shadow:0 0 0 0 rgba(227,174,106,.6)}70%{box-shadow:0 0 0 9px rgba(227,174,106,0)}100%{box-shadow:0 0 0 0 rgba(227,174,106,0)}}
.hd__tel{font-family:var(--lat);font-size:.9rem;letter-spacing:.1em}
.hd__tel:hover{color:var(--amber)}
.burger{width:46px;height:46px;border:1px solid var(--line);border-radius:50%;background:none;display:grid;
  place-content:center;gap:5px;cursor:pointer;transition:border-color .35s}
.burger:hover{border-color:var(--amber)}
.burger span{display:block;width:17px;height:1px;background:var(--ivory);transition:transform .4s var(--ease)}
.burger[aria-expanded=true] span:first-child{transform:translateY(3px) rotate(45deg)}
.burger[aria-expanded=true] span:last-child{transform:translateY(-3px) rotate(-45deg)}

.nav{position:fixed;inset:0;z-index:39;background:var(--ink);display:grid;place-content:center;gap:6px;
  text-align:center;clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease)}
.nav.is-on{clip-path:inset(0 0 0 0)}
.nav a{font-family:var(--disp);font-size:clamp(1.55rem,4.4vw,2.4rem);line-height:1.65;opacity:0;transform:translateY(18px);
  transition:opacity .6s var(--ease),transform .6s var(--ease),color .3s}
.nav.is-on a{opacity:1;transform:none}
.nav.is-on a:nth-child(1){transition-delay:.22s}.nav.is-on a:nth-child(2){transition-delay:.28s}
.nav.is-on a:nth-child(3){transition-delay:.34s}.nav.is-on a:nth-child(4){transition-delay:.40s}
.nav.is-on a:nth-child(5){transition-delay:.46s}.nav.is-on a:nth-child(6){transition-delay:.52s}
.nav.is-on a:nth-child(7){transition-delay:.58s}
.nav a:hover{color:var(--amber)}
.nav a em{font-family:var(--lat);font-style:normal;font-size:.4em;color:var(--smoke);margin-left:1em;letter-spacing:.18em}

/* ================= sections ================= */
.sec{padding-block:var(--sec);position:relative}
.sec--alt{background:var(--ink-2)}
.hgroup{display:flex;align-items:flex-start;gap:clamp(20px,4vw,64px);margin-bottom:clamp(44px,5vw,76px)}
.hgroup__idx{writing-mode:vertical-rl;font-family:var(--lat);font-size:.68rem;letter-spacing:.38em;color:var(--smoke);padding-top:7px;flex:none}
.hgroup h2{font-family:var(--disp);font-weight:600;font-size:clamp(1.55rem,3.3vw,2.45rem);line-height:1.55;letter-spacing:.04em}
.hgroup h2 em{display:block;font-family:var(--lat);font-style:normal;font-size:.36em;letter-spacing:.28em;color:var(--amber);margin-bottom:15px;font-weight:400}

.care{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.care li{background:var(--ink);padding:clamp(28px,3vw,42px);transition:background .5s var(--ease)}
.care li:hover{background:var(--ink-3)}
.care h3{font-family:var(--disp);font-size:1.1rem;letter-spacing:.08em;margin-bottom:6px}
.care em{display:block;font-family:var(--lat);font-style:normal;font-size:.66rem;letter-spacing:.22em;color:var(--amber);margin-bottom:15px}
.care p{font-size:.82rem;line-height:2;color:var(--smoke)}

.flow li{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,56px);padding:32px 0;border-top:1px solid var(--line)}
.flow li:last-child{border-bottom:1px solid var(--line)}
.flow b{font-family:var(--lat);font-size:1.65rem;font-weight:400;color:var(--plum);line-height:1;padding-top:8px}
.flow h3{font-family:var(--disp);font-size:1.08rem;letter-spacing:.1em;margin-bottom:8px}
.flow p{font-size:.84rem;color:var(--smoke);max-width:56ch}

.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(288px,1fr));gap:clamp(16px,2vw,26px)}
.card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:288px;
  padding:clamp(28px,3vw,40px);border:1px solid var(--line);background:var(--ink-3);overflow:hidden;transition:border-color .5s var(--ease)}
.card::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:var(--amber);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.card:hover{border-color:rgba(227,174,106,.35)}
.card:hover::after{transform:scaleX(1)}
.card em{font-family:var(--lat);font-style:normal;font-size:.64rem;letter-spacing:.24em;color:var(--smoke)}
.card h3{font-family:var(--disp);font-size:clamp(1.28rem,2.3vw,1.7rem);letter-spacing:.06em;margin:10px 0 12px}
.card p{font-size:.82rem;color:var(--smoke);margin-bottom:22px}
.card .go{font-size:.74rem;letter-spacing:.2em;color:var(--amber);display:inline-flex;gap:10px;align-items:center;margin:0}
.card .go span{transition:transform .4s var(--ease)}
.card:hover .go span{transform:translateX(6px)}

/* ---- ボタン（全ページ共通） ---- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:17px 34px;
  border:1px solid var(--amber);color:var(--amber);font-size:.82rem;letter-spacing:.22em;overflow:hidden;
  transition:color .45s var(--ease);isolation:isolate}
.btn::before{content:"";position:absolute;inset:0;background:var(--amber);transform:translateY(101%);
  transition:transform .5s var(--ease);z-index:-1}
.btn:hover{color:var(--ink)}
.btn:hover::before{transform:translateY(0)}
.btn--ghost{border-color:var(--line);color:var(--ivory)}
.btn--ghost::before{background:var(--ivory)}
.btn--ghost:hover{color:var(--ink)}

.band{background:var(--plum)}
.band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;padding-block:clamp(52px,6vw,84px)}
.band h2{font-family:var(--disp);font-size:clamp(1.35rem,2.7vw,1.95rem);letter-spacing:.06em;line-height:1.6}
.band p{font-size:.82rem;color:rgba(239,231,220,.75);margin-top:10px}
.band .btn{border-color:var(--ivory);color:var(--ivory)}
.band .btn::before{background:var(--ivory)}
.band .btn:hover{color:var(--plum)}

/* ================= footer ================= */
.ft{border-top:1px solid var(--line);padding-top:var(--sec)}
.ft__top{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(40px,6vw,90px);padding-bottom:60px}
.ft__mark b{display:block;font-family:var(--lat);font-size:1.55rem;font-weight:400;letter-spacing:.32em}
.ft__mark b em{font-style:normal;color:var(--amber)}
.ft__mark i{display:block;font-style:normal;font-family:var(--disp);font-size:.72rem;letter-spacing:.22em;color:var(--smoke)}
.ft__mark .tag{margin-top:26px;font-family:var(--disp);font-size:1.02rem;letter-spacing:.14em;color:rgba(239,231,220,.85)}
.ft dl{display:grid;grid-template-columns:auto 1fr;gap:15px 26px;font-size:.84rem;align-items:baseline}
.ft dt{font-family:var(--lat);font-size:.66rem;letter-spacing:.22em;color:var(--smoke)}
.ft dd a:hover{color:var(--amber)}
.ft .big{font-family:var(--lat);font-size:1.3rem;letter-spacing:.08em}
.ft .sm{font-size:.72rem;color:var(--smoke)}
.ft__line{display:flex;gap:20px;align-items:center;margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}
.ft__line img.qr{width:86px;border:6px solid var(--ivory);background:var(--ivory)}
.ft__line p{font-size:.75rem;color:var(--smoke);line-height:1.9}
.pay{display:inline-block;margin-top:24px;opacity:.7;transition:opacity .4s}
.pay:hover{opacity:1}
.pay img{max-width:250px}
.links{border-top:1px solid var(--line);padding-block:32px}
.links summary{cursor:pointer;font-size:.72rem;letter-spacing:.24em;color:var(--smoke);list-style:none}
.links summary::-webkit-details-marker{display:none}
.links summary::before{content:"＋ ";color:var(--amber)}
.links[open] summary::before{content:"− "}
.links__grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.links__grid a{filter:grayscale(1);opacity:.4;transition:filter .4s,opacity .4s}
.links__grid a:hover{filter:none;opacity:1}
.links__grid img{height:40px;width:auto}
.links__grid .txt{display:block;text-align:center;font-size:.58rem;color:var(--smoke)}
.copy{border-top:1px solid var(--line);padding-block:26px;display:flex;flex-wrap:wrap;gap:12px;
  justify-content:space-between;font-size:.68rem;letter-spacing:.13em;color:var(--smoke)}

.rv{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.rv.on{opacity:1;transform:none}

/* ================= responsive (shared) ================= */
@media(max-width:960px){
  .ft__top{grid-template-columns:1fr}
  .hd__tel,.hd .pill{display:none}
}
@media(max-width:560px){
  .flow li{grid-template-columns:1fr;gap:8px}
  .flow b{font-size:1.4rem}
  .ft__line{flex-direction:column;align-items:flex-start}
  .hd__mark{gap:12px}
  .hd__mark b{font-size:.96rem;letter-spacing:.26em;margin-right:-.26em}
  .hd__mark i{font-size:.56rem;letter-spacing:.16em;padding-left:12px}
  .ft__mark b{font-size:1.3rem;letter-spacing:.26em}
}
@media(max-width:400px){
  .hd__mark i{display:none}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}.rv{opacity:1;transform:none}
}
/* v10.5 ロゴマーク（オレンジの角丸に牛） */
.hd__logo{width:34px;height:34px;flex:none;display:block;transition:transform .4s var(--ease)}
.hd__mark:hover .hd__logo{transform:rotate(-6deg)}
.hd__mark{gap:14px}
.hd__mark::after{left:48px}
@media(max-width:560px){.hd__logo{width:30px;height:30px}.hd__mark{gap:10px}.hd__mark::after{left:40px}}
/* v10.9 カードに写真 */
.card--ph{--pad:clamp(28px,3vw,40px);justify-content:flex-start;min-height:0}
.card__ph{display:block;margin:calc(-1 * var(--pad)) calc(-1 * var(--pad)) 26px;aspect-ratio:8/5;overflow:hidden;position:relative;background:var(--ink)}
.card__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,26,0) 55%,rgba(20,16,26,.55) 100%)}
.card__ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease)}
.card--ph:hover .card__ph img{transform:scale(1.05)}
.card--ph p:not(.go){flex:1}
/* v10.10 カードの見出しは1行に収める */
.card h3{white-space:nowrap;font-size:clamp(1.15rem,1.85vw,1.55rem);letter-spacing:.04em}