/* business-cuisine.css — 線画HERO（business / cuisine）
   pages/*.css の完全一致ルールを抽出（保有ページの集合が同一のものだけ）。
   読込順は inc/assets.php が固定する。 */

.site-header .site-logo { filter: brightness(0); transition: filter .4s ease; }
.site-header .navbtn, .site-header .site-social { color: var(--slate); }
.draw-hero::before{
        content:"";
        position:absolute; inset:0; z-index:1;
        background-image:
          repeating-linear-gradient(0deg, rgba(0,0,0,.010) 0 1px, transparent 1px 3px),
          repeating-linear-gradient(90deg, rgba(0,0,0,.008) 0 1px, transparent 1px 4px);
        pointer-events:none;
        mix-blend-mode:multiply;
      }
.draw-hero .stage{ position:absolute; inset:0; width:100%; height:100%; }
.draw-hero .stage svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
#photo{ opacity:0; transition:opacity 3s ease; }
#photo.show{ opacity:1; }
#ink path{
        fill:none !important;
        stroke:#8a847f;
        stroke-width:2;
        stroke-linecap:round;
        stroke-linejoin:round;
        vector-effect:non-scaling-stroke;
      }
.draw-hero__intro{
        position:absolute; z-index:5; top:50%; left:0;
        width:min(92vw, 560px);
        padding:0 24px 0 clamp(24px, 6vw, 96px);
        color:#2b2622;
        
        opacity:0; transform:translateY(calc(-50% + 18px));
        transition:opacity 1.2s ease, transform 1.2s cubic-bezier(.2,.7,.2,1);
      }
.draw-hero__intro.show{ opacity:1; transform:translateY(-50%); }
.draw-hero__intro::before{
        content:""; position:absolute; z-index:-1;
        inset:-45% -35%;   
        background:radial-gradient(ellipse at 38% 50%, rgba(246,241,238,.92) 0%, rgba(246,241,238,.64) 42%, rgba(246,241,238,0) 74%);
        pointer-events:none;
      }
.draw-hero__kicker{
        font-family:'Lato', sans-serif; font-size:12px; letter-spacing:.32em; text-transform:uppercase;
        color:#8a6d3b; margin:0 0 18px;
      }
.draw-hero__title{
        font-family:'Vollkorn', serif; font-weight:600;
        font-size:clamp(46px, 7.6vw, 104px); line-height:1.02; letter-spacing:.02em;
        color:#2b2622; margin:0;
      }
.draw-hero__lead{
        margin:22px 0 0; max-width:30em;
        font-family:'Lato', sans-serif; font-size:clamp(13px,1.05vw,16px); line-height:1.95; color:#3a3531;
      }
.draw-hero__scroll{
        position:absolute; left:24px; bottom:26px; z-index:5;
        writing-mode:vertical-rl; font-family:'Lato', sans-serif; font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:#8a847f;
      }
@media (prefers-reduced-motion: reduce){
        #photo{ opacity:1; transition:none; }
        .draw-hero__intro{ opacity:1; transform:translateY(-50%); transition:none; }
      }
@media (max-width:640px){
        .draw-hero__intro{ top:auto; bottom:12%; transform:translateY(18px); width:100%; padding-right:24px; }
        .draw-hero__intro.show{ transform:translateY(0); }
      }
.cx-dark{ background:#20272a; color:#e9e4da; }
.cx-light{ background:#f6f1ee; color:#3a4145; }
.cx-wrap{ max-width:1360px; margin:0 auto; }
.cx-kicker{ font-family:"Lato",sans-serif; font-size:11px; font-weight:700; letter-spacing:.34em; text-transform:uppercase; color:#b98f4f; display:flex; align-items:center; gap:12px; margin:0 0 30px; }
.cx-kicker .idx{ opacity:.55; font-variant-numeric:tabular-nums; }
.cx-dark .cx-kicker{ color:#d8b877; }
.cx-h2{ font-family:"Vollkorn",serif; font-weight:600; font-size:clamp(28px,4.4vw,52px); line-height:1.18; margin:0; letter-spacing:.01em; color:#23292b; }
.cx-dark .cx-h2{ color:#f4efe6; }
.cx-dark .cx-h3{ color:#f4efe6; }
.cx-grid{ display:grid; grid-template-columns:1fr; gap:clamp(30px,5vw,72px); align-items:center; }
@media(min-width:1024px){ .cx-grid{ grid-template-columns:1fr 1fr; } .cx-grid--rev .cx-figure{ order:2; } }
.cx-p{ font-size:15px; line-height:2.05; margin:22px 0 0; color:#4a5155; }
.cx-dark .cx-p{ color:#c4beb2; }
.cx-p em{ font-style:italic; }
.cx-emph{ font-family:"Vollkorn",serif; font-weight:600; font-size:clamp(17px,2vw,22px); line-height:1.6; margin:24px 0 0; color:#23292b; }
.cx-dark .cx-emph{ color:#ecdcb0; }
.cx-muted{ font-size:14px; line-height:2; margin:22px 0 0; color:#6b7276; }
.cx-dark .cx-muted{ color:#9a948a; }
.cx-figure{ margin:0; }
.cx-figure img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; box-shadow:0 30px 70px rgba(0,0,0,.3); }
.cx-list li{ display:flex; gap:18px; align-items:baseline; padding:15px 0; border-top:1px solid rgba(35,41,43,.12); }
.cx-list li:last-child{ border-bottom:1px solid rgba(35,41,43,.12); }
.cx-dark .cx-list li{ border-top-color:rgba(255,255,255,.1); }
.cx-dark .cx-list li:last-child{ border-bottom-color:rgba(255,255,255,.1); }
.cx-tag{ flex:0 0 auto; min-width:6em; font-family:"Lato",sans-serif; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:#b98f4f; padding-top:2px; }
.cx-dark .cx-tag{ color:#d8b877; }
.cx-list .txt{ font-size:14px; line-height:1.75; }
.cx-cards{ display:grid; grid-template-columns:1fr; gap:1px; margin:8px 0 0; background:rgba(35,41,43,.12); border:1px solid rgba(35,41,43,.12); }
@media(min-width:768px){ .cx-cards{ grid-template-columns:repeat(3,1fr); } }
.cx-dark .cx-cards{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.1); }
.cx-card{ background:#f6f1ee; padding:34px 30px; }
.cx-dark .cx-card{ background:#20272a; }
.cx-card p{ font-size:13px; line-height:1.9; margin:0; color:#5a6165; }
.cx-dark .cx-card p{ color:#b6b0a5; }
.cx-dark .cx-divider{ border-top-color:rgba(255,255,255,.1); }
.cx-narrow{ max-width:52em; }
.cx-band{ position:relative; padding:104px clamp(22px,6vw,96px) 120px; color:#f4efe6; overflow:hidden; background:#181c1e; }
.cx-band__bg{ position:absolute; inset:0; z-index:0; }
.cx-band__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(20,24,26,.86), rgba(20,24,26,.5) 65%, rgba(20,24,26,.25)); }
.cx-band__in{ position:relative; z-index:1; max-width:1360px; margin:0 auto; }
.cx-band .cx-p{ color:#d6d0c4; }
.cx-band .cx-list li{ border-top-color:rgba(255,255,255,.14); }
.cx-band .cx-list li:last-child{ border-bottom-color:rgba(255,255,255,.14); }
.cx-band .cx-tag{ color:#d8b877; }
.cx-band .cx-emph{ color:#f4efe6; }
.cx-cta-row{ display:flex; flex-wrap:wrap; gap:14px; margin-top:38px; }
.cx-btn{ display:inline-flex; align-items:center; gap:10px; font-family:"Lato",sans-serif; font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; padding:15px 30px; border:1px solid; transition:background .3s,color .3s; cursor:pointer; }
.cx-btn--gold{ background:#c19a5e; border-color:#c19a5e; color:#20272a; }
.cx-btn--gold:hover{ background:#d8b877; border-color:#d8b877; }
.cx-btn--line{ background:transparent; border-color:rgba(255,255,255,.4); color:#f4efe6; }
.cx-btn--line:hover{ background:#f4efe6; color:#20272a; border-color:#f4efe6; }
