/* =========================================================
   つきじ治作 — business ページ固有スタイル（抽出元: business/index.html の <style>）
   body名前空間: page-business / url(): css/pages/基準 ../../images/
   ========================================================= */
/* =========================================================
   Occasions / Business — page-scoped styles
   Inherits tokens and global components from ../css/style.css
   ========================================================= */

/* page breathing-room under fixed header */
.op-main{padding-top:120px;}

/* ---------- Page hero (category banner) ---------- */
.op-hero{
  position:relative;
  min-height:clamp(420px, 72vh, 720px);
  display:flex;align-items:flex-end;
  overflow:hidden;
  isolation:isolate;
}
.op-hero__media{
  position:absolute;inset:0;z-index:-2;
  background:
    linear-gradient(180deg, rgba(11,22,32,.45) 0%, rgba(11,22,32,.82) 100%),
    url('../../images/business/Img13708.webp') center/cover no-repeat;
  transform:scale(1.04);
  animation:opHeroBreath 14s ease-in-out infinite alternate;
}
@keyframes opHeroBreath{to{transform:scale(1.0)}}
.op-hero__vignette{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 40%, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%);
}
.op-hero__inner{
  width:100%;
  padding:0 clamp(24px,8vw,120px) clamp(48px,8vh,96px);
  display:flex;align-items:flex-end;justify-content:space-between;gap:40px;
}
.op-hero__crumb{
  font-family:var(--en-serif);
  letter-spacing:.32em;text-transform:uppercase;
  font-size:11px;color:var(--mute);
  display:flex;align-items:center;gap:14px;
  margin-bottom:22px;
}
.op-hero__crumb a{color:var(--mute);opacity:.85;transition:opacity .3s;}
.op-hero__crumb a:hover{opacity:1;color:var(--gold-hi);}
.op-hero__crumb .sep{width:22px;height:.5px;background:var(--mute);opacity:.5;}
.op-hero__title{
  font-family:var(--serif-display);
  font-weight:500;
  font-size:clamp(24px,3vw,40px);
  letter-spacing:.22em;
  line-height:1.5;
  color:var(--mute);
  margin-bottom:10px;
}
.op-hero__sub{
  font-family:var(--en-serif);
  letter-spacing:.36em;text-transform:uppercase;
  font-size:12px;color:var(--gold);
  margin:0 0 22px;
}
.op-hero__lead{
  max-width:32em;
  font-size:14px;line-height:2;letter-spacing:.14em;
  color:rgba(232,226,212,.88);
}

.op-hero__kanji{
  flex-shrink:0;
  writing-mode:vertical-rl;
  font-family:var(--serif-display);
  font-weight:700;
  font-size:clamp(72px,9vw,140px);
  letter-spacing:.1em;
  line-height:1;
  color:var(--mute);
  text-shadow:0 6px 30px rgba(0,0,0,.55);
  position:relative;
  padding-left:28px;
}
.op-hero__kanji::before{
  content:"";position:absolute;left:0;top:6px;bottom:6px;width:.5px;background:var(--gold);opacity:.5;
}
.op-hero__kanji .tag{
  display:block;
  font-family:var(--serif);
  font-weight:400;
  font-size:14px;letter-spacing:.3em;
  color:var(--gold);
  margin-top:20px;
}

/* ---------- Intro block ---------- */
.op-intro{padding:clamp(80px,10vh,140px) 0 0;}
.op-intro__inner{max-width:980px;margin:0 auto;text-align:center;}
.op-intro__en{font-family:var(--en-serif);letter-spacing:.32em;font-size:11px;color:var(--gold);text-transform:uppercase;}
.op-intro__h{
  font-family:var(--serif-display);
  font-weight:500;
  font-size:clamp(22px,2.4vw,30px);
  letter-spacing:.22em;
  line-height:1.7;
  margin-top:18px;
}
.op-intro__body{
  margin-top:28px;
  font-size:14px;line-height:2;letter-spacing:.12em;
  color:rgba(232,226,212,.85);
  max-width:40em;margin-left:auto;margin-right:auto;
}
.op-intro__rule{
  width:1px;height:56px;background:var(--gold);opacity:.6;margin:40px auto 0;
}

/* ---------- Concerns strip (安心材料) ---------- */







/* ---------- Scene index / anchor nav ---------- */






/* 3-col layout borders */














/* ---------- Scene section (full-bleed image + overlaid heading) ---------- */
.scenes{padding:clamp(48px,6vh,80px) 0 0;}




/* Full-bleed media wrapper: overflow visible so the heading can bleed below */

/* Inner clip — keeps the img rectangle cropped and scrimmed */


.scene.is-in .scene__media-clip img{transform:scale(1);}
/* Subtle scrim fading in at the bottom so the half-overlapped title reads */


/* Main JP heading — straddles the image bottom edge, ~50% overlap.
   Horizontal position is aligned to the content column (same max-width
   + padding as .scene__header / .scene__body), not the viewport edge. */



/* Header block below the image — EN gold + sub copy */







/* Running number, now a quiet caption above the EN kicker */


/* Body content sits under the image in a contained column */












/* ---------- Scene plans (3-col plan cards + 2-col options/consult) ---------- */






/* 3-col plan cards */











.plan-card__price .num{
  font-family:var(--serif);font-weight:500;font-size:19px;letter-spacing:.04em;color:var(--gold-hi);
}
.plan-card__price .unit{
  font-family:var(--serif);font-weight:400;
  font-size:11px;letter-spacing:.08em;color:rgba(232,226,212,.65);
}

/* 2-col: options + consult */












.scene__plans-consult-btn .ico{
  display:inline-flex;color:var(--gold);
  transition:color .4s var(--ease);
}


.scene__plans-consult-btn:hover .ico{color:var(--gold-hi);}


/* ---------- Scene pricing simulation (inline ledger above CTA) ---------- */







.scene__sim-ledger .it{
  font-size:13px;letter-spacing:.1em;color:var(--mute);
}
.scene__sim-ledger .it .note{
  display:block;
  font-family:var(--en-body);font-style:italic;
  font-size:11px;letter-spacing:.04em;color:rgba(232,226,212,.5);
  margin-top:2px;
}
.scene__sim-ledger .pr{
  font-family:var(--serif);
  font-size:13px;letter-spacing:.04em;color:var(--gold-hi);
  white-space:nowrap;
}

.scene__sim-total .lab{
  font-family:var(--serif-display);font-weight:500;
  font-size:14px;letter-spacing:.22em;color:var(--mute);
}
.scene__sim-total .amt{
  font-family:var(--serif);font-weight:500;
  font-size:19px;letter-spacing:.04em;color:var(--gold-hi);
}
.scene__sim-total .amt .unit{
  font-size:11px;color:rgba(216,184,122,.75);margin-left:6px;letter-spacing:.08em;
}




.scene__sim-opt-list .pr{color:var(--gold-hi);font-size:12.5px;white-space:nowrap;}


/* 3-CTA bar per scene — unified stage-style link button.
   Standalone 1-column section sitting centered under scene__sim. */



.scene__cta a .ico{
  display:inline-flex;color:var(--gold);
  transition:color .4s var(--ease);
}
.scene__cta a:hover .ico{color:var(--gold-hi);}
.scene__cta a .lab{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1.35;}
.scene__cta a .lab .sub{
  font-family:var(--en-body);font-style:italic;
  font-size:10px;letter-spacing:.12em;color:rgba(216,184,122,.7);
  margin-top:2px;
  transition:color .4s var(--ease);
}
.scene__cta a:hover .lab .sub{color:var(--gold-hi);}
/* Leftmost scene-guide CTA: gold-tinted, acts as the topic gateway */

.scene__cta a.scene__cta--primary .ico{color:var(--gold-hi);}

/* trailing arrow element, drawn in CSS so HTML stays untouched */


/* neutralize the previously-filled primary variant */


/* ---------- Bottom CTA band ---------- */







.op-foot-cta__bar .ico{
  color:var(--gold);
  display:inline-flex;align-items:center;justify-content:center;
  line-height:0;
}
.op-foot-cta__bar .ico svg{display:block;}
.op-foot-cta__bar a:hover .ico{color:var(--ink);}

/* ---------- Back to category ---------- */





/* ---------- Reveal per scene ---------- */

.scene.is-in{opacity:1;transform:translateY(0);}

/* ---------- Business plans collection ---------- */






















.op-plan__price .num{
  font-size:15px;letter-spacing:.04em;
}
.op-plan__price .unit{
  font-size:11px;color:rgba(216,184,122,.75);
  margin-left:6px;letter-spacing:.06em;
}





/* ---------- Responsive ---------- */
@media (max-width:1080px){
  
  /* 2-col: reset 3-col rules, then apply 2-col */
  
  
  
  
  
  
  
  
}
@media (max-width:900px){
  
  
  
  
  
  .op-hero__inner{flex-direction:column;align-items:flex-start;gap:28px;}
  .op-hero__kanji{padding-left:0;padding-top:24px;writing-mode:horizontal-tb;font-size:clamp(56px,10vw,96px);}
  .op-hero__kanji::before{left:0;top:0;right:0;bottom:auto;height:.5px;width:60px;}
  .op-hero__kanji .tag{margin-top:14px;font-size:12px;}
}
@media (max-width:767px){
  .op-main{padding-top:88px;}
  .op-hero{min-height:clamp(360px,60vh,520px);}
  .op-hero__inner{padding:0 24px clamp(40px,6vh,64px);}
  .op-hero__title{font-size:clamp(20px,5vw,26px);letter-spacing:.2em;}
  .op-hero__lead{font-size:13px;line-height:1.95;letter-spacing:.1em;}
  
  
  /* 1-col: all vertical dividers removed, every item beyond the first gets a top rule */
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  /* mobile: all scenes anchor left for a consistent rhythm */
  
  
  
  
  
  
  
  
  
  
  
  /* very narrow screens: allow wrap so nowrap never causes horizontal overflow */
  
  
  
  
  
  
  
  
  
  
}
@media (max-width:480px){
  .op-hero__title{font-size:22px;line-height:1.6;}
  .op-intro__h{font-size:18px;letter-spacing:.18em;}
  
  
}
/* Unified dark navy — match top index */
html, body, body.is-day{background-color:#1a2638 !important;color:var(--mute);}
.header{background:#1a2638 !important;}
.header.is-scrolled{background:rgba(26,38,56,.85) !important;}
.footer{background:#1a2638 !important;margin-top:0 !important;}

/* ============================================================
   BUSINESS — Scene-Based Plan Page (Seiga-style redesign)
   Scoped to .biz; navy + cream + gold palette.
   Whitespace is intentionally more generous than the reference
   mockup per project brief.
   ============================================================ */
.biz{
  --biz-bg:#1a2638;
  --biz-bg-deep:#0f1827;
  --biz-cream:#efe8d6;
  --biz-cream-soft:rgba(239,232,214,.78);
  --biz-cream-mute:rgba(239,232,214,.55);
  --biz-gold:#c9a464;
  --biz-gold-hi:#e2c58a;
  --biz-ink:#1a2638;
  --biz-ink-soft:rgba(26,38,56,.66);
  --biz-ink-mute:rgba(26,38,56,.45);
  --biz-line-navy:rgba(239,232,214,.16);
  --biz-line-cream:rgba(26,38,56,.14);
  /* Aligned with top-level index.html (style.css :root tokens) */
  --biz-serif:var(--serif);
  --biz-en:var(--en-serif);
  --biz-en-sans:var(--en-serif);
  /* Match the page header's horizontal padding so .biz__wrap aligns
     edge-to-edge with the header rather than capping at 1280px. */
  --biz-gutter:clamp(24px,8vw,120px);
  --biz-section-pad:clamp(70px,8vw,130px);
  --biz-card-pad:clamp(40px,5vw,80px);

  padding-top:110px;
  background:var(--biz-bg);
  color:var(--biz-cream);
  font-family:var(--biz-serif);
  font-weight:400;
  line-height:1.85;
  letter-spacing:.04em;
  font-feature-settings:"palt";
}
.biz *{box-sizing:border-box;}
.biz img{max-width:100%;display:block;}
.biz a{color:inherit;text-decoration:none;}

.biz__wrap{
  max-width:1600px;margin-inline:auto;
  padding-inline:var(--biz-gutter);
  padding-block:clamp(20px,2.4vw,34px);
  position:relative;
}

/* Vertical text helper */


/* Section headings (Kicker + heading common pattern) */
.biz__kicker{
  display:inline-block;
  font-family:var(--biz-en-sans);
  font-size:11px;letter-spacing:.4em;
  color:var(--biz-gold);text-transform:uppercase;
  font-weight:500;
}
.biz__section-h{
  font-family:var(--biz-serif);font-weight:500;
  font-size:32px;letter-spacing:.18em;
  margin:18px 0 0;
  position:relative;
  display:inline-block;
}
.biz__section-h::before,
.biz__section-h::after{
  content:"";display:inline-block;vertical-align:middle;
  width:clamp(40px,6vw,80px);height:1px;
  background:var(--biz-gold);opacity:.55;
  margin:0 clamp(20px,2.5vw,32px);
}
.biz__section-head{
  text-align:center;
  margin-bottom:clamp(60px,7vw,100px);
}

/* ============================================================
   HERO — full-bleed cover image with 50%-width text panel
   that fades to transparent on the right side.
   ============================================================ */
/* Fold wrapper — HERO + features always fill first viewport */
.biz-fold{
  min-height:calc(100vh - 110px);
  display:flex;flex-direction:column;
}
.biz-hero{
  position:relative;
  flex:1 1 auto;
  min-height:auto;
  background-color:var(--biz-bg);
  background-image:url('../../images/business/business-cover.jpg');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
  display:flex;
  align-items:stretch;
}
.biz-features{flex:0 0 auto;}
.biz-hero__text{
  width:50%;
  flex:0 0 50%;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  padding:clamp(60px,8vw,120px) clamp(50px,7vw,120px) clamp(60px,8vw,120px) var(--biz-gutter);
  /* Long, gradual fade — solid only at the very left, the rest
     transitions smoothly to transparent at the right edge. */
  background-image:linear-gradient(
    to right,
    #1a2638 0%,
    #1a2638 20%,
    rgba(26,38,56,.94) 35%,
    rgba(26,38,56,.82) 50%,
    rgba(26,38,56,.62) 65%,
    rgba(26,38,56,.38) 80%,
    rgba(26,38,56,.15) 92%,
    rgba(26,38,56,0) 100%
  );
}
/* Breadcrumb */
.biz-hero__crumb{
  display:flex;align-items:center;gap:14px;
  font-family:var(--biz-en);font-size:11px;letter-spacing:.32em;
  text-transform:uppercase;color:var(--biz-cream-mute);
  margin:0 0 26px;
}
.biz-hero__crumb a{color:var(--biz-cream-soft);transition:color .3s;}
.biz-hero__crumb a:hover{color:var(--biz-gold-hi);}
.biz-hero__crumb .sep{width:22px;height:1px;background:var(--biz-cream-mute);}
.biz-hero__title{
  font-family:var(--biz-serif);font-weight:500;
  font-size:36px;
  line-height:1.45;letter-spacing:.16em;
  color:var(--biz-cream);
  margin:0 0 12px;
}
.biz-hero__sub-en{
  display:block;
  font-family:var(--biz-en);font-style:italic;
  font-size:13px;letter-spacing:.3em;
  color:var(--biz-gold);text-transform:uppercase;
  margin:0 0 28px;
}
.biz-hero__lead{
  font-size:16px;line-height:1.95;letter-spacing:.08em;
  color:var(--biz-cream-soft);
  max-width:32em;margin:0;
}

/* ============================================================
   FEATURES STRIP — 4-icon row (sits inside the dark hero block)
   ============================================================ */
.biz-features{
  position:relative;
  padding:0;
  border-top:1px solid rgba(201,164,100,.3);
  border-bottom:1px solid rgba(201,164,100,.3);
  background:var(--biz-bg);
}
.biz-features__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,3vw,60px);
}
.biz-feat{
  display:flex;align-items:center;gap:20px;
  padding:0 clamp(10px,1.5vw,24px);
  position:relative;
}
.biz-feat + .biz-feat::before{
  content:"";position:absolute;left:0;top:10%;bottom:10%;
  width:1px;background:var(--biz-line-navy);
}
.biz-feat__icon{
  flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--biz-gold);
}
.biz-feat__icon svg{width:34px;height:34px;}
.biz-feat__text{display:flex;flex-direction:column;gap:6px;}
.biz-feat__title{
  font-family:var(--biz-serif);font-weight:500;font-size:15px;
  letter-spacing:.18em;color:var(--biz-cream);
}
.biz-feat__sub{
  font-size:11px;line-height:1.7;letter-spacing:.06em;
  color:var(--biz-cream-mute);
}

/* ============================================================
   WHY — editorial intro & reason grid
   ============================================================ */
.biz-why{
  padding:var(--biz-section-pad) 0 clamp(80px,10vw,140px);
}
.biz-why__head{
  text-align:center;
  max-width:56em;
  margin:0 auto clamp(60px,8vw,110px);
}
.biz-why__kicker{
  display:inline-block;
  font-family:var(--biz-en);font-style:italic;font-weight:500;
  font-size:13px;letter-spacing:.28em;
  color:var(--biz-gold);
}
.biz-why__h{
  font-family:var(--biz-serif);font-weight:500;
  font-size:clamp(24px,2.8vw,36px);letter-spacing:.18em;
  line-height:1.6;
  color:var(--biz-cream);
  margin:22px 0 28px;
}
.biz-why__lead{
  font-size:14.5px;line-height:2.05;letter-spacing:.08em;
  color:var(--biz-cream-soft);
  margin:0 auto;max-width:52em;
}
.biz-why__line{
  display:block;
  width:1px;height:clamp(110px,16vw,200px);
  background:linear-gradient(180deg, rgba(201,164,100,0) 0%, var(--biz-gold) 18%, var(--biz-gold) 82%, rgba(201,164,100,0) 100%);
  margin:clamp(40px,5vw,72px) auto clamp(56px,7vw,96px);
  transform:scaleY(0);
  transform-origin:top center;
  opacity:.85;
}
.biz-why__line.is-in{
  transform:scaleY(1);
  transition:transform 1.8s cubic-bezier(.2,.7,.2,1) .15s;
}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .biz-why__line{
      transform:scaleY(0);
      animation:bizWhyDraw linear both;
      animation-timeline:view();
      animation-range:cover 5% cover 45%;
    }
    @keyframes bizWhyDraw{to{transform:scaleY(1);}}
  }
}
.biz-why__grid{
  list-style:none;margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(36px,4vw,56px) clamp(40px,4.5vw,72px);
}
.biz-why__item{
  position:relative;
  padding:clamp(28px,3vw,40px) 0 0;
  border-top:1px solid var(--biz-line-navy);
}
.biz-why__num{
  font-family:var(--biz-en);font-style:italic;font-weight:500;
  font-size:14px;letter-spacing:.12em;
  color:var(--biz-gold);
  display:block;margin-bottom:14px;
}
.biz-why__title{
  font-family:var(--biz-serif);font-weight:500;
  font-size:clamp(16px,1.4vw,19px);letter-spacing:.16em;
  color:var(--biz-cream);
  margin:0 0 14px;line-height:1.55;
}
.biz-why__body{
  font-size:13px;line-height:2.0;letter-spacing:.08em;
  color:var(--biz-cream-soft);
  margin:0;
}

/* ============================================================
   PLANS — 4 alternating cards
   ============================================================ */
.biz-plans{
  padding:var(--biz-section-pad) 0;
  position:relative;
}
.biz-plans__list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:clamp(60px,7vw,110px) clamp(40px,5vw,80px);
}
.biz-plan{
  display:flex;flex-direction:column;
  background:transparent;
  color:var(--biz-cream);
  border:none;
  border-radius:0;
  overflow:visible;
  position:relative;
  box-shadow:none;
  min-height:0;
}
.biz-plan--reverse{
  /* In a 2-col grid, no reverse — keep vertical card layout */
  flex-direction:column;
}
.biz-plan--reverse .biz-plan__media{order:0;}
.biz-plan__media{
  position:relative;
  aspect-ratio:1.45/1;
  overflow:hidden;
  background:#0f1827;
}
.biz-plan__media img{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;
  transition:transform 1.4s ease;
}
.biz-plan:hover .biz-plan__media img{transform:scale(1.04);}
.biz-plan__card{
  padding:clamp(24px,3vw,36px) 0 0;
  display:flex;flex-direction:column;
  position:relative;
  background:transparent;
}

.biz-plan__title{
  font-family:var(--biz-serif);font-weight:500;
  font-size:clamp(20px,2vw,26px);letter-spacing:.18em;
  color:var(--biz-cream);
  margin:0 0 18px;line-height:1.5;
}
.biz-plan__desc{
  font-size:14px;line-height:2;letter-spacing:.08em;
  color:var(--biz-cream-soft);
  margin:0 0 24px;
}
.biz-plan__price{
  display:flex;align-items:baseline;flex-wrap:wrap;
  gap:14px;margin-bottom:22px;
}
.biz-plan__price-lab{
  font-family:var(--biz-serif);font-size:13px;letter-spacing:.16em;
  color:var(--biz-cream-soft);
}
.biz-plan__price-num{
  font-family:var(--biz-en);font-style:italic;
  font-size:clamp(22px,2.4vw,30px);font-weight:500;
  color:var(--biz-cream);letter-spacing:.02em;
}
.biz-plan__price-tax{
  font-size:11px;letter-spacing:.1em;color:var(--biz-cream-mute);
}
.biz-plan__tags{
  display:flex;flex-wrap:wrap;gap:8px;
  margin:0 0 28px;padding:0;list-style:none;
}
.biz-plan__tags li{
  font-family:var(--biz-serif);font-size:11px;letter-spacing:.12em;
  color:var(--biz-cream-soft);
  padding:5px 14px;
  border:1px solid rgba(239,232,214,.2);
  border-radius:0;
  background:transparent;
}
.biz-plan__cta{
  align-self:flex-start;
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  font-family:var(--biz-serif);font-size:13px;letter-spacing:.24em;
  color:var(--biz-cream);
  background:transparent;
  padding:14px clamp(26px,2.6vw,38px);
  border:1px solid rgba(201,164,100,.6);
  border-radius:0;
  transition:background .3s, color .3s, border-color .3s;
}
.biz-plan__cta::after{
  content:"";display:inline-block;
  width:18px;height:1px;background:currentColor;
  position:relative;
}
.biz-plan__cta:hover{
  background:var(--biz-gold);
  color:var(--biz-ink);
  border-color:var(--biz-gold);
}
.biz-plans__note{
  text-align:center;
  margin-top:clamp(60px,7vw,90px);
  font-size:11px;letter-spacing:.1em;color:var(--biz-cream-mute);
}

/* ============================================================
   COMPARISON TABLE
   ============================================================ */
/* ============================================================
   EXPERIENCES BANNER (full-bleed collage + overlaid copy)
   ============================================================ */
.biz-exp{
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  min-height:clamp(560px,82vh,820px);
  padding:var(--biz-section-pad) var(--biz-gutter);
  overflow:hidden;
}
.biz-exp__media{
  position:absolute;inset:0;z-index:-2;
  background:url("../../images/business/cultures.jpg") center/cover no-repeat;
  transform:scale(1.04);
}
.biz-exp__overlay{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(90deg,
      rgba(15,24,39,.92) 0%,
      rgba(15,24,39,.80) 32%,
      rgba(15,24,39,.42) 64%,
      rgba(15,24,39,.30) 100%),
    linear-gradient(180deg,
      rgba(15,24,39,.55) 0%,
      rgba(15,24,39,.10) 30%,
      rgba(15,24,39,.45) 100%);
}
.biz-exp__inner{
  max-width:640px;
  margin-right:auto;
}
.biz-exp__kicker{
  display:inline-block;
  font-family:var(--biz-en-sans);
  font-size:11px;letter-spacing:.4em;
  color:var(--biz-gold-hi);text-transform:uppercase;
  font-weight:500;
}
.biz-exp__h{
  font-family:var(--biz-serif);font-weight:500;
  font-size:32px;
  letter-spacing:.12em;line-height:1.5;
  margin:22px 0 0;
  color:var(--biz-cream);
  text-shadow:0 2px 24px rgba(15,24,39,.55);
}
.biz-exp__lead{
  margin:28px 0 0;
  max-width:30em;
  font-size:clamp(14px,1.05vw,15.5px);
  line-height:2.05;letter-spacing:.05em;
  color:var(--biz-cream-soft);
  text-shadow:0 1px 14px rgba(15,24,39,.5);
}
.biz-exp__tags{
  list-style:none;margin:34px 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:10px 12px;
}
.biz-exp__tags li{
  font-size:12.5px;letter-spacing:.08em;
  color:var(--biz-cream);
  padding:8px 16px;
  border:1px solid rgba(201,164,100,.55);
  border-radius:999px;
  background:rgba(15,24,39,.34);
  backdrop-filter:blur(2px);
}
.biz-exp__cta{
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  margin-top:40px;
  font-family:var(--biz-serif);font-size:13px;letter-spacing:.24em;
  color:var(--biz-cream);
  background:transparent;
  padding:14px clamp(26px,2.6vw,38px);
  border:1px solid rgba(201,164,100,.6);
  border-radius:0;
  transition:background .3s, color .3s, border-color .3s;
}
.biz-exp__cta:hover{
  background:var(--biz-gold);
  border-color:var(--biz-gold);
  color:var(--biz-ink);
}
.biz-exp__cta-arrow{
  width:18px;height:1px;background:currentColor;
  position:relative;
}

/* ============================================================
   FLOW — 4-step process
   ============================================================ */
.biz-flow{
  padding:var(--biz-section-pad) 0;
}
.biz-flow__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,2.5vw,40px);
  position:relative;
}
.biz-flow__grid::before{
  content:"";
  position:absolute;
  /* Aligned to the icon-circle's vertical center:
     num row (18px + 12px margin = 30px) + circle radius 42px = 72px */
  top:72px;left:12.5%;right:12.5%;
  height:1px;background:rgba(201,164,100,.3);
  z-index:0;
}
.biz-flow__step{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;
  position:relative;
  z-index:1;
  padding:0 clamp(8px,1.5vw,18px);
}
.biz-flow__num{
  font-family:var(--biz-en);font-style:italic;font-weight:500;
  font-size:18px;color:var(--biz-gold);
  letter-spacing:.05em;
  margin-bottom:12px;
  display:inline-block;line-height:1;
}
.biz-flow__num-en{display:inline-block;}
.biz-flow__icon{
  width:84px;height:84px;
  border-radius:50%;
  background:var(--biz-bg);
  border:1px solid rgba(201,164,100,.5);
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--biz-gold);
  margin-bottom:24px;
}
.biz-flow__icon svg{width:32px;height:32px;}
.biz-flow__h{
  font-family:var(--biz-serif);font-weight:500;font-size:15px;
  letter-spacing:.18em;color:var(--biz-cream);margin:0 0 14px;
}
.biz-flow__body{
  font-size:12px;line-height:1.95;letter-spacing:.06em;
  color:var(--biz-cream-mute);max-width:18em;
}

/* ============================================================
   COLLECTION — Business Plans + Event Options
   (Reuses the testimonial-card visual language: cream-bordered
   panel with hero image on top, body below.)
   ============================================================ */




















/* ============================================================
   FAQ — 2-col
   ============================================================ */
.biz-faq{
  padding:var(--biz-section-pad) 0;
}
.biz-faq__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
  gap:0 clamp(50px,6vw,90px);
  border-top:1px solid rgba(201,164,100,.3);
}
.biz-faq__item{
  border-bottom:1px solid rgba(201,164,100,.3);
}
.biz-faq__head{
  display:flex;align-items:center;gap:18px;
  padding:24px 4px;
  cursor:pointer;
  transition:color .25s;
}
.biz-faq__head:hover{color:var(--biz-gold-hi);}
.biz-faq__q{
  font-family:var(--biz-en);font-style:italic;
  font-size:20px;color:var(--biz-gold);font-weight:500;
  flex-shrink:0;line-height:1;
  width:28px;
}
.biz-faq__text{
  font-family:var(--biz-serif);font-size:13px;letter-spacing:.12em;
  color:var(--biz-cream);
  flex:1;
}
.biz-faq__chev{
  width:9px;height:9px;flex-shrink:0;
  border-right:1px solid var(--biz-cream-mute);
  border-bottom:1px solid var(--biz-cream-mute);
  transform:rotate(-45deg);
  transition:transform .3s, border-color .3s;
}
.biz-faq__head:hover .biz-faq__chev{border-color:var(--biz-gold-hi);}
.biz-faq__a{
  max-height:0;overflow:hidden;opacity:0;
  padding:0 4px 0 46px;
  font-family:var(--biz-serif);font-size:13px;line-height:1.95;letter-spacing:.06em;
  color:var(--biz-cream-mute);
  transition:max-height .4s ease,opacity .3s ease,padding .4s ease;
}
.biz-faq__item.is-open .biz-faq__a{
  max-height:340px;opacity:1;
  padding:2px 4px 24px 46px;
}
.biz-faq__item.is-open .biz-faq__chev{transform:rotate(45deg);}

/* ============================================================
   CTA BAND — Contact (3-button bar)
   ============================================================ */
.biz-cta{
  padding:clamp(80px,9vw,140px) 0;
  background:var(--biz-bg);
  border-top:1px solid var(--biz-line-navy);
  text-align:center;
}
.biz-cta__inner{
  display:flex;flex-direction:column;align-items:center;
  gap:clamp(24px,3vw,40px);
}
.biz-cta__en{
  font-family:var(--biz-en-sans);font-weight:500;
  font-size:11px;letter-spacing:.4em;
  color:var(--biz-gold);text-transform:uppercase;
}
.biz-cta__h{
  font-family:var(--biz-serif);font-weight:500;
  font-size:clamp(22px,2.6vw,30px);letter-spacing:.2em;
  color:var(--biz-cream);margin:14px 0 0;
}
.biz-cta__sub{
  font-size:13px;letter-spacing:.1em;color:var(--biz-cream-mute);
  margin:0;
}
.biz-cta__bar{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,1.4vw,22px);
  width:100%;max-width:960px;
  margin-top:clamp(20px,2vw,30px);
}
.biz-cta__bar a{
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  padding:22px 18px;
  background:transparent;
  border:1px solid rgba(201,164,100,.5);
  color:var(--biz-cream);
  font-family:var(--biz-serif);font-size:13px;letter-spacing:.18em;
  border-radius:0;
  transition:background .3s, color .3s, border-color .3s;
}
.biz-cta__bar a:hover{
  background:var(--biz-gold);
  color:var(--biz-ink);
  border-color:var(--biz-gold);
}
.biz-cta__bar .ico{
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--biz-gold-hi);
  transition:color .3s;
}
.biz-cta__bar a:hover .ico{color:var(--biz-ink);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .biz-hero__text{width:62%;}
  .biz-features__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;}
  .biz-feat + .biz-feat::before{display:none;}
  .biz-plans__list{grid-template-columns:repeat(2,minmax(0,1fr));}
  .biz-plan__media{aspect-ratio:1.5/1;}
  
  .biz-why__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .biz-cta__bar{grid-template-columns:1fr;}
  .biz-cta__inner{flex-direction:column;align-items:flex-start;}
  
  
}
@media (max-width:760px){
  /* Stack vertically: image on top, text block below */
  .biz-hero{
    min-height:0;
    flex-direction:column;
    background-image:none;
  }
  .biz-hero::before{
    content:"";
    display:block;
    width:100%;
    height:clamp(220px,52vw,320px);
    background:url('../../images/business/business-cover.jpg') center/cover no-repeat;
  }
  .biz-hero__text{
    width:100%;
    flex:0 0 auto;
    background-image:none;
    background-color:var(--biz-bg);
    padding:clamp(40px,8vw,56px) var(--biz-gutter);
  }
  .biz-features__grid{grid-template-columns:1fr;}
  .biz-flow__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:50px 20px;}
  .biz-flow__grid::before{display:none;}
  .biz-faq__grid{grid-template-columns:1fr;}
  
  .biz-why__grid{grid-template-columns:1fr;}
  .biz-plans__list{grid-template-columns:1fr;}
  .biz__section-h{font-size:22px;letter-spacing:.14em;}
  .biz__section-h::before,
  .biz__section-h::after{display:none;}
  .biz-hero__title{font-size:28px;}
  .biz-hero__lead{font-size:14px;}
  .biz-exp{min-height:0;}
  .biz-exp__media{background-position:60% center;}
  .biz-exp__overlay{
    background:linear-gradient(180deg,
      rgba(15,24,39,.72) 0%,
      rgba(15,24,39,.86) 55%,
      rgba(15,24,39,.92) 100%);
  }
  .biz-exp__inner{max-width:none;}
  .biz-exp__h{font-size:22px;letter-spacing:.08em;}
}
@media (max-width:480px){
  .biz-plan__card{padding:30px 24px;}
  .biz-plan__title{font-size:18px;letter-spacing:.12em;}
  .biz-exp__tags li{padding:7px 13px;font-size:12px;}
  .biz-exp__cta{width:100%;justify-content:center;}
}

/* Remove footer top margin (defaults to 120px in global style.css) */
.biz + .footer{margin-top:0;}
