/* =========================================================
   BIB HOLDINGS (M) SDN BHD — Corporate profile
   Navy · cream · gold — editorial, real-company aesthetic
   ========================================================= */

:root{
  --ink:#0a141e;
  --ink-2:#0d1a27;
  --ink-3:#122436;
  --paper:#f5f2ea;
  --paper-2:#ece5d6;
  --paper-3:#e4dccb;

  --line-d:rgba(255,255,255,.12);
  --line-d2:rgba(255,255,255,.2);
  --line-l:rgba(16,28,40,.14);
  --line-l2:rgba(16,28,40,.26);

  --t-dark:#eef2f6;        /* text on dark */
  --t-dark-soft:#b4c1cd;
  --t-dark-mute:#78899a;
  --t-light:#132131;       /* text on light */
  --t-light-soft:#465768;
  --t-light-mute:#7b8a97;

  /* Luxe accent = champagne gold (corporate chrome) */
  --gold:#c39a45;     /* primary luxe accent */
  --gold-2:#d8b96a;   /* hover / lighter */
  --gold-3:#ecd39a;   /* light gold on dark */
  --grad-gold:linear-gradient(135deg,#f4e3ad 0%,#d3ab55 42%,#a97f34 100%);
  --grad-gold-soft:linear-gradient(135deg,#e8cf94,#c39a45);
  /* Financial Gate product identity (teal → blue → purple) — used on FG marks */
  --brand-teal:#2fcabf;
  --brand-blue:#2f6be6;
  --brand-indigo:#2a3a8f;
  --brand-purple:#6a3fd0;
  --grad-brand:linear-gradient(120deg,#2fcabf 0%,#2f6be6 46%,#6a3fd0 100%);
  --navy:#16255a;
  --ink-glow:rgba(195,154,69,.14);

  --maxw:1220px;
  --gutter:clamp(20px,5vw,54px);

  --serif:"Lora","Noto Serif JP",Georgia,"Times New Roman",serif;
  --sans:"Inter","Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-2:cubic-bezier(.65,.05,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans);
  background:var(--ink);
  color:var(--t-dark);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  font-weight:400;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }

/* ---------- Typography ---------- */
h1,h2,h3,h4{ font-family:var(--serif); font-weight:600; line-height:1.16; letter-spacing:-.01em; }
.display{ font-size:clamp(2.6rem,6.4vw,5.2rem); font-weight:600; line-height:1.06; letter-spacing:-.02em; }
.h1{ font-size:clamp(2.1rem,4.6vw,3.5rem); }
.h2{ font-size:clamp(1.7rem,3.2vw,2.4rem); }
.h3{ font-size:clamp(1.25rem,2vw,1.55rem); }
.serif{ font-family:var(--serif); }
.lead{ font-size:clamp(1.05rem,1.5vw,1.24rem); line-height:1.7; }

/* Section-eyebrow / overline label */
.overline{
  display:inline-flex; align-items:center; gap:14px;
  font-family:var(--sans); font-size:.74rem; font-weight:600; letter-spacing:.28em; text-transform:uppercase;
  color:var(--gold); margin-bottom:26px;
}
.overline::before{ content:""; width:34px; height:1px; background:currentColor; transform-origin:left; }
.on-light .overline{ color:var(--gold); }

/* ---------- Layout ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); position:relative; }
.section{ padding-block:clamp(72px,11vw,150px); position:relative; }
.on-dark{ background:var(--ink); color:var(--t-dark); }
.on-dark-2{ background:var(--ink-2); color:var(--t-dark); }
.on-light{ background:var(--paper); color:var(--t-light); }
.on-light .lead,.on-light p{ color:var(--t-light-soft); }
.on-dark .lead,.on-dark p{ color:var(--t-dark-soft); }
.sec-head{ max-width:760px; margin-bottom:clamp(40px,6vw,68px); }
.center{ text-align:center; margin-inline:auto; }
.center .overline{ justify-content:center; }

/* ---------- Buttons / links ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.7em; font-family:var(--sans);
  padding:15px 30px; font-size:.92rem; font-weight:600; letter-spacing:.02em;
  border-radius:2px; transition:all .35s var(--ease); position:relative;
}
.btn svg{ width:16px;height:16px; transition:transform .35s var(--ease); }
.btn:hover svg{ transform:translateX(4px); }
.btn-solid{ background:var(--gold); color:#fff; }
.btn-solid:hover{ background:var(--gold-2); transform:translateY(-2px); }
.btn-line{ border:1px solid var(--line-d2); color:var(--t-dark); }
.btn-line:hover{ border-color:var(--gold-2); color:#fff; }
.on-light .btn-line{ border-color:var(--line-l2); color:var(--t-light); }
.on-light .btn-line:hover{ border-color:var(--gold); background:var(--gold); color:#fff; }

.arrow-link{ display:inline-flex; align-items:center; gap:10px; font-family:var(--sans); font-weight:600; font-size:.95rem;
  color:var(--gold); position:relative; padding-bottom:3px; }
.arrow-link::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
.arrow-link:hover::after{ transform:scaleX(1); }
.arrow-link svg{ width:15px;height:15px; transition:transform .35s var(--ease); }
.arrow-link:hover svg{ transform:translateX(4px); }

/* ---------- Scroll progress ---------- */
.progress{ position:fixed; top:0; left:0; height:2px; width:0; background:linear-gradient(90deg,var(--gold),var(--gold-3)); z-index:200; }

/* ---------- Navbar ---------- */
.nav{ position:fixed; top:0; left:0; right:0; z-index:100; transition:background .45s var(--ease), border-color .45s, padding .45s; border-bottom:1px solid transparent; }
.nav .wrap{ display:flex; align-items:center; justify-content:space-between; padding-block:22px; transition:padding .45s; }
.nav.scrolled{ background:rgba(9,17,25,.86); backdrop-filter:blur(16px) saturate(140%); border-bottom:1px solid var(--line-d); }
.nav.scrolled .wrap{ padding-block:14px; }
.brand{ display:flex; flex-direction:column; line-height:1; }
.brand .bm{ font-family:var(--sans); font-weight:800; font-size:1.28rem; letter-spacing:.12em; color:#fff; }
.brand .bs{ font-family:var(--sans); font-size:.56rem; font-weight:500; letter-spacing:.34em; color:var(--t-dark-mute); text-transform:uppercase; margin-top:4px; }
/* real BIB wordmark logo (white transparent PNG) */
.brand-logo{ display:block; height:22px; width:auto; transition:opacity .3s; }
.brand:hover .brand-logo{ opacity:.82; }
.brand-tag{ display:block; font-family:var(--sans); font-size:.54rem; font-weight:500; letter-spacing:.3em; color:var(--t-dark-mute); text-transform:uppercase; margin-top:7px; white-space:nowrap; }
/* Financial Gate logo lockup */
.fg-lockup{ display:inline-flex; align-items:center; gap:12px; margin-bottom:18px; }
.fg-lockup img{ height:30px; width:auto; }
.fg-lockup .fg-name{ font-family:var(--sans); font-weight:700; font-size:1.05rem; letter-spacing:.02em; color:var(--t-light); }
.grad-brand-text{ background:var(--grad-brand); -webkit-background-clip:text; background-clip:text; color:transparent; }
.nav-links{ display:flex; align-items:center; gap:4px; }
.nav-links a{ padding:9px 16px; font-family:var(--sans); font-size:.9rem; font-weight:500; color:var(--t-dark-soft); position:relative; white-space:nowrap; transition:color .25s; }
.nav-links a::after{ content:""; position:absolute; left:16px; right:16px; bottom:4px; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.nav-links a:hover{ color:#fff; } .nav-links a:hover::after{ transform:scaleX(1); }
.nav-right{ display:flex; align-items:center; gap:16px; }
.lang{ display:flex; gap:2px; font-family:var(--sans); font-size:.76rem; font-weight:600; }
.lang button{ padding:6px 9px; color:var(--t-dark-mute); border-radius:2px; transition:.25s; letter-spacing:.06em; }
.lang button.active{ color:var(--gold-3); }
.lang span{ color:var(--line-d2); }
.burger{ display:none; width:42px;height:42px; border:1px solid var(--line-d2); border-radius:3px; }
.burger span{ display:block; width:18px;height:1.5px; background:#fff; margin:4px auto; transition:.3s; }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.hero-media{ position:absolute; inset:0; z-index:0; }
.hero-media img{ width:100%; height:100%; object-fit:cover; animation:kenburns 22s ease-out forwards; }
@keyframes kenburns{ from{ transform:scale(1.12) } to{ transform:scale(1) } }
.hero-media::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(8,15,22,.72) 0%,rgba(8,15,22,.3) 34%,rgba(8,15,22,.55) 68%,rgba(8,15,22,.96) 100%); }
.hero-media::before{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg,rgba(8,15,22,.72),transparent 60%); }
.hero .wrap{ z-index:2; padding-bottom:clamp(56px,9vh,120px); padding-top:140px; }
.hero-eyebrow{ display:inline-flex; align-items:center; gap:12px; font-size:.76rem; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-3); margin-bottom:26px; }
.hero-eyebrow .r{ width:40px;height:1px;background:var(--gold-3); }
.hero h1{ max-width:16ch; margin-bottom:28px; color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.4); }
.hero .lead{ max-width:52ch; color:#dbe4ec; margin-bottom:40px; }
.hero-cta{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.hero-scroll{ position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:8px;
  font-family:var(--sans); font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:var(--t-dark-mute); }
.hero-scroll .bar{ width:1px; height:46px; background:linear-gradient(var(--gold-3),transparent); position:relative; overflow:hidden; }
.hero-scroll .bar::after{ content:""; position:absolute; top:0; left:0; width:100%; height:40%; background:var(--gold-3); animation:scrolldot 2.2s var(--ease) infinite; }
@keyframes scrolldot{ 0%{ transform:translateY(-100%) } 100%{ transform:translateY(300%) } }

/* ---------- Marquee ---------- */
.marquee{ border-block:1px solid var(--line-d); background:var(--ink-2); overflow:hidden; padding-block:20px; }
.marquee-track{ display:flex; gap:0; white-space:nowrap; width:max-content; animation:marquee 34s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-track span{ font-family:var(--serif); font-size:1.05rem; color:var(--t-dark-soft); padding-inline:34px; display:inline-flex; align-items:center; gap:34px; }
.marquee-track span::after{ content:"◆"; color:var(--gold); font-size:.6rem; }
@keyframes marquee{ to{ transform:translateX(-50%) } }

/* ---------- Statement (intro) ---------- */
.statement .big{ font-family:var(--serif); font-size:clamp(1.7rem,3.8vw,3rem); line-height:1.3; font-weight:500; max-width:20ch; }
.statement .big .hl{ color:var(--gold); font-style:italic; }
.statement-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(36px,6vw,80px); align-items:end; }
.statement-grid .body p+p{ margin-top:18px; }

/* ---------- Stats strip ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); }
.stats .st{ padding:38px clamp(16px,2.5vw,34px); border-left:1px solid var(--line-d); }
.stats .st:first-child{ border-left:none; }
.on-light .stats .st{ border-color:var(--line-l); }
.stats .num{ font-family:var(--serif); font-size:clamp(2.3rem,4.4vw,3.4rem); font-weight:600; line-height:1; }
.on-dark .stats .num{ color:#fff; } .on-light .stats .num{ color:var(--t-light); }
.stats .num .u{ color:var(--gold); }
.stats .lbl{ margin-top:12px; font-family:var(--sans); font-size:.82rem; letter-spacing:.02em; }
.on-dark .stats .lbl{ color:var(--t-dark-mute); } .on-light .stats .lbl{ color:var(--t-light-mute); }

/* ---------- Message / split ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,6vw,74px); align-items:center; }
.media-reveal{ position:relative; overflow:hidden; border-radius:3px; }
.media-reveal img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease); transform:scale(1.06); }
.media-reveal.in img{ transform:scale(1); }
.media-reveal::before{ content:""; position:absolute; inset:0; z-index:2; background:var(--paper); transform:scaleX(1); transform-origin:right; transition:transform 1s var(--ease-2); }
.on-dark .media-reveal::before{ background:var(--ink); }
.media-reveal.in::before{ transform:scaleX(0); }
.media-tall img{ aspect-ratio:4/5; }
.media-wide img{ aspect-ratio:16/10; }
.sign{ font-family:var(--serif); font-style:italic; font-size:1.1rem; color:var(--gold); margin-top:24px; }

/* ---------- Businesses ---------- */
.biz-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(20px,2.5vw,30px); }
.biz{ position:relative; background:#fff; border:1px solid var(--line-l); border-radius:4px; overflow:hidden; transition:transform .5s var(--ease), box-shadow .5s var(--ease); display:flex; flex-direction:column; }
.on-light .biz{ box-shadow:0 1px 0 rgba(16,28,40,.03); }
.biz:hover{ transform:translateY(-6px); box-shadow:0 30px 60px -30px rgba(16,28,40,.28); }
.biz-media{ height:230px; overflow:hidden; position:relative; }
.biz-media img{ width:100%;height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.biz:hover .biz-media img{ transform:scale(1.05); }
.biz-media .kbadge{ position:absolute; top:16px; left:16px; background:rgba(10,20,30,.82); color:#fff; font-family:var(--sans); font-size:.66rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; padding:6px 12px; border-radius:2px; }
.biz-body{ padding:30px clamp(24px,3vw,36px) 34px; flex:1; display:flex; flex-direction:column; }
.biz-body h3{ font-size:1.4rem; margin-bottom:6px; color:var(--t-light); }
.biz-body .sub{ font-family:var(--sans); font-size:.76rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.biz-body p{ font-size:.96rem; color:var(--t-light-soft); margin-bottom:22px; flex:1; }
.biz-sub{ display:flex; flex-wrap:wrap; gap:8px; }
.biz-sub li{ font-family:var(--sans); font-size:.78rem; color:var(--t-light-soft); border:1px solid var(--line-l); border-radius:100px; padding:5px 13px; }

/* ---------- Corporate movie ---------- */
.movie-frame{ position:relative; aspect-ratio:16/9; border-radius:4px; overflow:hidden; border:1px solid var(--line-d); box-shadow:0 40px 90px -40px rgba(0,0,0,.8); background:#000; }
.movie-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.movie-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; background:#000; }
.movie-cover{ position:absolute; inset:0; cursor:pointer; z-index:3; transition:opacity .4s var(--ease); }
.movie-cover.hidden{ opacity:0; pointer-events:none; }
.movie-cover img{ width:100%;height:100%;object-fit:cover; }
.movie-cover::after{ content:""; position:absolute; inset:0; background:linear-gradient(rgba(8,15,22,.25),rgba(8,15,22,.6)); }
.play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; width:84px;height:84px; border-radius:50%;
  background:rgba(255,255,255,.12); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.5); display:grid; place-items:center; transition:transform .4s var(--ease), background .4s; }
.movie-cover:hover .play{ transform:translate(-50%,-50%) scale(1.08); background:var(--gold); border-color:var(--gold); }
.play svg{ width:26px;height:26px; margin-left:4px; color:#fff; }

/* ---------- Global band (parallax) ---------- */
.band{ position:relative; overflow:hidden; }
.band-bg{ position:absolute; inset:-10% 0; z-index:0; }
.band-bg img{ width:100%; height:120%; object-fit:cover; }
.band::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(rgba(8,14,20,.68),rgba(8,14,20,.86)); }
.band .wrap{ z-index:2; }

/* ---------- Corporate overview table ---------- */
.overview{ border-top:1px solid var(--line-l); }
.ov-row{ display:grid; grid-template-columns:220px 1fr; gap:24px; padding:24px 4px; border-bottom:1px solid var(--line-l); align-items:baseline; }
.ov-row dt{ font-family:var(--sans); font-size:.82rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); }
.ov-row dd{ font-size:1rem; color:var(--t-light); }
.ov-row dd small{ display:block; color:var(--t-light-mute); font-size:.85rem; margin-top:4px; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,6vw,70px); }
.field{ margin-bottom:20px; }
.field label{ display:block; font-family:var(--sans); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--t-dark-mute); margin-bottom:9px; }
.field input,.field textarea{ width:100%; padding:14px 0; background:transparent; border:none; border-bottom:1px solid var(--line-d2); color:#fff; font-family:var(--sans); font-size:1rem; transition:border-color .3s; }
.field input::placeholder,.field textarea::placeholder{ color:var(--t-dark-mute); }
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--gold-2); }
.field textarea{ resize:vertical; min-height:110px; }
.info .ln{ display:flex; gap:18px; padding:22px 0; border-bottom:1px solid var(--line-d); }
.info .ln:first-child{ padding-top:0; }
.info .ic{ width:22px;height:22px;flex:none; color:var(--gold-2); margin-top:2px; }
.info h4{ font-family:var(--sans); font-size:.74rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--t-dark-mute); margin-bottom:6px; }
.info p{ color:var(--t-dark); font-size:1rem; } .info a{ color:var(--gold-2); }
#formNote{ margin-top:14px; font-size:.85rem; color:var(--t-dark-mute); }

/* ---------- Footer ---------- */
.footer{ background:#070f17; border-top:1px solid var(--line-d); padding-block:64px 30px; }
.foot-top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.1fr; gap:36px; padding-bottom:44px; border-bottom:1px solid var(--line-d); }
.footer .brand{ margin-bottom:18px; }
.footer .fdesc{ color:var(--t-dark-mute); font-size:.9rem; max-width:34ch; line-height:1.7; }
.foot-col h5{ font-family:var(--sans); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--t-dark-soft); margin-bottom:16px; }
.foot-col a{ display:block; color:var(--t-dark-mute); font-size:.9rem; padding:6px 0; transition:color .25s; }
.foot-col a:hover{ color:var(--gold-2); }
.foot-bottom{ display:flex; justify-content:space-between; gap:16px; padding-top:24px; color:var(--t-dark-mute); font-size:.82rem; flex-wrap:wrap; font-family:var(--sans); }
.foot-legal{ display:flex; gap:22px; }
.foot-legal a{ color:var(--t-dark-mute); transition:color .25s; }
.foot-legal a:hover{ color:var(--gold-2); }

/* ---------- Reveal ---------- */
[data-reveal]{ opacity:0; transform:translateY(30px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
[data-reveal].in{ opacity:1; transform:none; }
[data-rd="1"]{ transition-delay:.09s } [data-rd="2"]{ transition-delay:.18s }
[data-rd="3"]{ transition-delay:.27s } [data-rd="4"]{ transition-delay:.36s }
.hero [data-reveal]{ transform:translateY(24px); }

/* ---------- i18n (text swapped by JS) ---------- */
/* Japanese headings: modern gothic (not old-fashioned mincho), tight & punchy */
html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3,
html[lang="ja"] h4,
html[lang="ja"] .display,
html[lang="ja"] .big{
  font-family:"Inter","Noto Sans JP",sans-serif;
  font-weight:800;
  letter-spacing:.005em;
  line-height:1.28;
}
html[lang="ja"] .display{ line-height:1.15; letter-spacing:0; }
html[lang="ja"] .big{ font-weight:700; line-height:1.35; }
html[lang="ja"] .sign{ font-family:"Noto Sans JP",sans-serif; font-style:normal; font-weight:500; }

/* =========================================================
   RICH ENHANCEMENTS
   ========================================================= */

/* Global film grain for a premium, print-like texture */
body::after{
  content:""; 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='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* Richer dark sections — deep navy gradient + soft gold glow */
.on-dark, .footer{ background:radial-gradient(120% 90% at 50% -10%, #10202f 0%, var(--ink) 55%); }
.on-dark-2{ background:radial-gradient(120% 90% at 80% 0%, #12283a 0%, var(--ink-2) 60%); }
.on-dark::before, .on-dark-2::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(60% 50% at 15% 20%, var(--ink-glow), transparent 70%); }
.on-dark > .wrap, .on-dark-2 > .wrap{ position:relative; z-index:1; }

/* Warm hairline separators between sections */
.on-light + .on-dark, .on-dark + .on-light{ box-shadow:inset 0 1px 0 rgba(195,154,69,.18); }

/* Overline — gold gradient tick + refined */
.overline{ color:var(--gold); }
.overline::before{ height:1px; width:40px; background:var(--grad-gold); }
.on-dark .overline, .on-dark-2 .overline, .band .overline{ color:var(--gold-3); }

/* Gold gradient buttons */
.btn-solid{ background:var(--grad-gold); color:#241704; font-weight:700; letter-spacing:.03em; box-shadow:0 10px 30px -12px rgba(195,154,69,.6); position:relative; overflow:hidden; }
.btn-solid::before{ content:""; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent); transform:skewX(-18deg); transition:left .7s var(--ease); }
.btn-solid:hover{ background:var(--grad-gold); transform:translateY(-2px); box-shadow:0 16px 40px -14px rgba(195,154,69,.75); }
.btn-solid:hover::before{ left:130%; }
.btn-line:hover{ border-color:var(--gold-2); color:#fff; box-shadow:inset 0 0 0 1px rgba(195,154,69,.4); }
.on-light .btn-line:hover{ background:var(--grad-gold); border-color:transparent; color:#241704; }

/* Gold display accents */
.gold-line{ display:inline-block; width:56px; height:2px; background:var(--grad-gold); margin-bottom:26px; }
.stats .num .u{ background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; }
.marquee-track span::after{ color:var(--gold); }
.arrow-link{ color:var(--gold); }
.sign{ color:var(--gold); }

/* Hero — richer overlay, EST seal, keyword shimmer */
.hero-media::after{ background:linear-gradient(180deg,rgba(7,13,20,.72) 0%,rgba(7,13,20,.28) 30%,rgba(7,13,20,.5) 62%,rgba(7,13,20,.97) 100%),
  radial-gradient(80% 60% at 20% 80%, rgba(195,154,69,.14), transparent 70%); }
.hero-eyebrow{ color:var(--gold-3); }
.hero-eyebrow .r{ background:var(--grad-gold); width:46px; }

/* Businesses — gradient border on hover, richer media */
.biz{ border-radius:6px; }
.biz::after{ content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(140deg,var(--gold-2),transparent 45%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; transition:opacity .5s; }
.biz:hover::after{ opacity:1; }
.biz:hover{ box-shadow:0 40px 80px -34px rgba(16,28,40,.4); }
.biz-media{ height:250px; }
.biz-media .kbadge{ background:linear-gradient(135deg,rgba(10,20,30,.9),rgba(20,32,46,.85)); border:1px solid rgba(195,154,69,.35); color:var(--gold-3); }
.biz-body h3{ font-family:var(--serif); }
.biz-body .fg-name{ font-family:var(--serif); font-size:1.35rem; }

/* Movie frame — gold edge */
.movie-frame{ border:1px solid rgba(195,154,69,.28); box-shadow:0 50px 110px -50px rgba(0,0,0,.9), 0 0 0 1px rgba(195,154,69,.08); }
.movie-cover:hover .play{ background:var(--grad-gold); border-color:transparent; }

/* Company overview — gold rule accents */
.overview{ border-top:1px solid rgba(195,154,69,.35); }
.ov-row dt{ color:var(--gold); }
.ov-row{ transition:padding-left .4s var(--ease); }
.ov-row:hover{ padding-left:12px; }

/* ---------- Timeline ---------- */
.timeline{ position:relative; margin-top:14px; }
.tl-item{ display:grid; grid-template-columns:180px 1fr; gap:34px; padding:30px 0; border-top:1px solid var(--line-d); position:relative; }
.tl-item:last-child{ border-bottom:1px solid var(--line-d); }
.tl-year{ font-family:var(--serif); font-size:clamp(1.8rem,3vw,2.5rem); background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; line-height:1; }
.tl-body h4{ font-family:var(--serif); font-size:1.2rem; margin-bottom:8px; color:#fff; }
.tl-body p{ color:var(--t-dark-soft); font-size:.96rem; max-width:56ch; }
.tl-item::after{ content:""; position:absolute; left:180px; top:34px; width:9px; height:9px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(195,154,69,.18); transform:translateX(-50%); }
.on-light .tl-item{ border-color:var(--line-l); }
.on-light .tl-body h4{ color:var(--t-light); }
.on-light .tl-body p{ color:var(--t-light-soft); }

/* ---------- Quote (full-bleed) ---------- */
.quote{ position:relative; overflow:hidden; }
.quote-bg{ position:absolute; inset:0; z-index:0; }
.quote-bg img{ width:100%; height:100%; object-fit:cover; }
.quote::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(7,13,20,.94),rgba(7,13,20,.62)); }
.quote .wrap{ position:relative; z-index:2; }
.quote .mark{ font-family:var(--serif); font-size:6rem; line-height:.7; background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; display:block; margin-bottom:6px; }
.quote blockquote{ font-family:var(--serif); font-size:clamp(1.6rem,3.4vw,2.7rem); line-height:1.4; font-weight:500; color:#fff; max-width:22ch; }
html[lang="ja"] .quote blockquote{ font-family:"Inter","Noto Sans JP",sans-serif; font-weight:700; }

/* ---------- Footer CTA band ---------- */
.foot-cta{ border-top:1px solid rgba(195,154,69,.3); }
.foot-cta .wrap{ display:flex; align-items:center; justify-content:space-between; gap:28px; padding-block:clamp(44px,6vw,72px); flex-wrap:wrap; }
.foot-cta h3{ font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.4rem); color:#fff; max-width:18ch; }
html[lang="ja"] .foot-cta h3{ font-family:"Inter","Noto Sans JP",sans-serif; font-weight:800; }

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .statement-grid{ grid-template-columns:1fr; gap:34px; align-items:start; }
  .biz-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:1024px){
  .brand-tag{ display:none; }
  .nav-links{ position:fixed; inset:0 0 auto 0; flex-direction:column; align-items:stretch; background:rgba(8,15,22,.98); backdrop-filter:blur(20px); padding:92px 26px 34px; gap:2px; transform:translateY(-110%); transition:transform .5s var(--ease); border-bottom:1px solid var(--line-d); }
  .nav-links.open{ transform:none; }
  .nav-links a{ padding:15px 6px; font-size:1.05rem; border-bottom:1px solid var(--line-d); }
  .nav-links a::after{ display:none; }
  .burger{ display:block; z-index:120; }
  .split{ grid-template-columns:1fr; }
  .split .media-side{ order:-1; }
  .contact-grid{ grid-template-columns:1fr; }
}
@media (max-width:680px){
  .stats{ grid-template-columns:1fr 1fr; }
  .stats .st{ border-left:none; border-top:1px solid var(--line-d); padding:26px 4px; }
  .on-light .stats .st{ border-top-color:var(--line-l); }
  .stats .st:first-child,.stats .st:nth-child(2){ border-top:none; }
  .biz-grid{ grid-template-columns:1fr; }
  .foot-top{ grid-template-columns:1fr 1fr; gap:28px; }
  .ov-row{ grid-template-columns:1fr; gap:6px; padding:18px 4px; }
  .hero h1{ font-size:clamp(2.1rem,9vw,3rem); }
  .tl-item{ grid-template-columns:1fr; gap:8px; }
  .tl-item::after{ left:0; }
  .foot-cta .wrap{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:420px){ .foot-top{ grid-template-columns:1fr; } }

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms!important; transition-duration:.001ms!important; }
  .hero-media img{ animation:none; transform:none; }
}