/* ============================================================
   ANVICA — DESIGN TOKENS
   ============================================================ */
:root{
  --black:#0F0F10;
  --panel:#161413;
  --panel-2:#1D1A17;
  --gold:#C89B3C;
  --gold-soft:#E9D5B0;
  --gold-deep:#8f6d26;
  --white:#F8F8F5;
  --ivory:#F6F2EA;
  --brown:#3A2414;
  --emerald:#0D7C4A;
  --line: rgba(248,248,245,0.10);
  --line-strong: rgba(200,155,60,0.35);

  --font-display: 'Fraunces', serif;
  --font-body: 'Manrope', sans-serif;

  --ease: cubic-bezier(.22,1,.36,1);
  --dur-s: .4s;
  --dur-m: .8s;
  --dur-l: 1.4s;

  --container: 1240px;
  --gutter: clamp(20px, 5vw, 80px);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}
body{
  margin:0;
  background:var(--black);
  color:var(--ivory);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
h1,h2,h3,h4{font-family:var(--font-display); font-weight:500; margin:0; letter-spacing:-0.01em;}
p{margin:0;}
.container{max-width:var(--container); margin:0 auto; padding:0 var(--gutter);}

/* ---------- Utility: eyebrow / hallmark signature ---------- */
.hallmark{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-body); font-size:12px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gold-soft); font-weight:600; margin-bottom:22px;
}
.hallmark svg{width:20px; height:20px; flex:none;}
.hallmark .rule{width:36px; height:1px; background:linear-gradient(90deg,var(--gold),transparent);}

/* ---------- Buttons ---------- */
.btn{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:16px 34px;
  font-size:13px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
  border:1px solid var(--gold);
  color:var(--white);
  background:transparent;
  border-radius:2px;
  overflow:hidden;
  transition: color var(--dur-s) var(--ease), border-color var(--dur-s) var(--ease), transform var(--dur-s) var(--ease);
}
.btn::before{
  content:'';
  position:absolute; inset:0;
  background:var(--gold);
  transform:translateY(101%);
  transition:transform var(--dur-m) var(--ease);
  z-index:-1;
}
.btn:hover{color:var(--black); transform:translateY(-2px);}
.btn:hover::before{transform:translateY(0);}
.btn-solid{background:var(--gold); color:var(--black); border-color:var(--gold);}
.btn-solid::before{background:var(--white);}
.btn-solid:hover{color:var(--black);}
.btn:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:1.5px solid var(--gold); outline-offset:3px;
}

/* ============================================================
   LOADER
   ============================================================ */
#loader{
  position:fixed; inset:0; z-index:9999;
  background:var(--black);
  display:flex; align-items:center; justify-content:center;
  transition: opacity .9s var(--ease), visibility .9s var(--ease);
}
#loader.done{opacity:0; visibility:hidden; pointer-events:none;}
#loader svg{width:120px; height:120px;}
#loader .mark-path{
  fill:none; stroke:var(--gold); stroke-width:1.4;
  stroke-dasharray:600; stroke-dashoffset:600;
  animation: draw 2.1s var(--ease) forwards;
}
@keyframes draw{ to{stroke-dashoffset:0;} }

/* ---------- Scroll progress ---------- */
#progress{
  position:fixed; top:0; left:0; height:2px; width:0%;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold),var(--gold-soft));
  z-index:9998;
}

/* ============================================================
   NAV
   ============================================================ */
header{
  position:fixed; top:0; left:0; right:0; z-index:900;
  padding:26px 0;
  transition: padding var(--dur-s) var(--ease), background var(--dur-s) var(--ease), border-color var(--dur-s) var(--ease);
  border-bottom:1px solid transparent;
}
header.scrolled{
  padding:14px 0;
  background:rgba(15,15,16,0.86);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom:1px solid var(--line);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between;}
.brand{display:flex; align-items:center; gap:12px;}
.brand img{height:34px; width:auto; transition:height var(--dur-s) var(--ease);}
header.scrolled .brand img{height:28px;}
.brand-name{font-family:var(--font-display); font-size:15px; letter-spacing:.06em; color:var(--white); display:none;}
nav.links{display:flex; align-items:center; gap:38px;}
nav.links a{
  font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:600;
  color:var(--ivory); opacity:.78; position:relative; padding:4px 0;
}
nav.links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold);
  transition:width var(--dur-s) var(--ease);
}
nav.links a:hover{opacity:1;}
nav.links a:hover::after{width:100%;}
.nav-cta{display:flex; align-items:center; gap:22px;}
.nav-cta .btn{padding:12px 24px; font-size:11.5px;}
.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; padding:8px; z-index:901;}
.burger span{width:24px; height:1px; background:var(--white); transition:all var(--dur-s) var(--ease);}
.burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

.drawer{
  position:fixed; inset:0; z-index:850;
  background:rgba(15,15,16,0.98);
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  gap:26px; padding:0 var(--gutter);
  transform:translateY(-100%);
  transition:transform .6s var(--ease);
}
.drawer.open{transform:translateY(0);}
.drawer a{font-family:var(--font-display); font-size:34px; color:var(--white);}
.drawer .btn{margin-top:20px;}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:flex-end;
  padding-top:160px; padding-bottom:90px; overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 900px 600px at 78% 18%, rgba(200,155,60,0.16), transparent 60%),
    radial-gradient(ellipse 700px 500px at 10% 90%, rgba(13,124,74,0.08), transparent 60%),
    linear-gradient(180deg,#0F0F10 0%, #121011 60%, #0F0F10 100%);
}
.hero-bg svg{position:absolute; inset:0; width:100%; height:100%; opacity:.5;}
.hero-noise{position:absolute; inset:0; opacity:.05; mix-blend-mode:overlay; pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><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>");
}
.hero-rays{position:absolute; top:-20%; right:-10%; width:70%; height:140%; z-index:0;
  background: conic-gradient(from 200deg at 50% 50%, transparent 0deg, rgba(200,155,60,0.09) 6deg, rgba(200,155,60,0.03) 14deg, transparent 24deg, transparent 336deg, rgba(200,155,60,0.05) 350deg);
  animation: rotateSlow 46s linear infinite;
  transform-origin:center;
  filter:blur(1px);
}
@keyframes rotateSlow{to{transform:rotate(360deg);}}
@keyframes rotateSlowReverse{to{transform:rotate(-360deg);}}

.hero-inner{position:relative; z-index:2; width:100%;}
.hero-grid{display:grid; grid-template-columns:1.28fr 1fr; gap:70px; align-items:end;}
.hero-eyebrow{
  display:flex; align-items:center; gap:14px; margin-bottom:28px;
  font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-soft); font-weight:700;
}
.hero-eyebrow .rule{width:60px; height:1px; background:var(--gold);}
.hero h1{
  font-size:clamp(48px, 7.4vw, 108px);
  line-height:0.98;
  color:var(--white);
  letter-spacing:-0.015em;
}
.hero h1 .line{display:block; overflow:hidden;}
.hero h1 .line span{display:inline-block; transform:translateY(110%); animation:riseUp 1.2s var(--ease) forwards;}
.hero h1 .line:nth-child(1) span{animation-delay:.3s;}
.hero h1 .line:nth-child(2) span{animation-delay:.46s;}
.hero h1 .gold-word{
  background:linear-gradient(120deg,var(--gold-soft), var(--gold) 40%, #fff6df 55%, var(--gold) 70%, var(--gold-deep));
  background-size:250% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  animation: shine 6s linear infinite;
}
@keyframes shine{ to{ background-position:-250% 0; } }
@keyframes riseUp{ to{transform:translateY(0);} }

.hero-sub{
  max-width:460px; margin-top:36px; padding-top:24px;
  border-top:1px solid var(--line-strong);
  opacity:0; animation:fadeUp 1s var(--ease) forwards; animation-delay:.9s;
}
.hero-sub p{font-size:16px; color:var(--ivory); opacity:.82; margin-bottom:26px;}
.hero-cta{display:flex; gap:16px; flex-wrap:wrap;}
@keyframes fadeUp{ from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:translateY(0);} }

/* ---------- Hero visual stack (placeholder frames for future imagery) ---------- */
.hero-stack{
  position:relative; width:100%; max-width:400px; aspect-ratio:4/5;
  justify-self:end; margin-bottom:6px;
  opacity:0; animation:stackIn 1.2s var(--ease) forwards; animation-delay:1.1s;
}
@keyframes stackIn{ from{opacity:0; transform:translateY(26px) scale(.96);} to{opacity:1; transform:translateY(0) scale(1);} }

.stack-ring{
  position:absolute; top:-9%; right:-12%; width:58%; aspect-ratio:1/1;
  border:1px solid rgba(200,155,60,.32); border-radius:50%; z-index:1; pointer-events:none;
  animation: rotateSlow 42s linear infinite;
}
.stack-ring::after{
  content:''; position:absolute; top:-3px; left:50%; width:6px; height:6px; margin-left:-3px;
  background:var(--gold-soft); border-radius:50%; box-shadow:0 0 10px 1px rgba(233,213,176,.65);
}
.stack-ring.ring-2{
  width:78%; top:-18%; right:-20%; border-color:rgba(200,155,60,.15);
  animation: rotateSlowReverse 64s linear infinite;
}
.stack-ring.ring-2::after{content:none;}

.stack-card{
  position:absolute; border-radius:3px; overflow:hidden;
  border:1px solid var(--line-strong);
  background:linear-gradient(155deg, rgba(232,197,138,.16), rgba(22,19,16,.68) 55%, rgba(9,8,7,.94));
  box-shadow:0 40px 70px -32px rgba(0,0,0,.65), inset 0 0 0 1px rgba(200,155,60,.06);
  transform:rotate(var(--r,0deg));
  animation:floatCard 7.5s ease-in-out infinite;
  animation-delay:var(--delay,0s);
  transition:box-shadow var(--dur-m) var(--ease), border-color var(--dur-m) var(--ease);
  will-change:transform;
}
.stack-card:hover{ box-shadow:0 50px 90px -30px rgba(0,0,0,.72); border-color:rgba(200,155,60,.55); }
@keyframes floatCard{
  0%,100%{ transform:translateY(0) rotate(var(--r,0deg)); }
  50%{ transform:translateY(-14px) rotate(var(--r,0deg)); }
}
.stack-card .corner{position:absolute; width:16px; height:16px; opacity:.7;}
.stack-card .corner.tl{top:13px; left:13px; border-top:1.5px solid var(--gold); border-left:1.5px solid var(--gold);}
.stack-card .corner.br{bottom:13px; right:13px; border-bottom:1.5px solid var(--gold); border-right:1.5px solid var(--gold);}
.stack-card .ph-icon{position:absolute; top:50%; left:50%; width:19%; transform:translate(-50%,-50%); opacity:.2;}
.card-tag{position:absolute; left:16px; bottom:14px; font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--gold-soft); opacity:.85; font-weight:600;}

.card-a{ width:74%; height:80%; left:0; top:3%; z-index:2; --r:-3deg; --delay:0s; }
.card-b{ width:54%; height:44%; right:-5%; bottom:5%; z-index:3; --r:5deg; --delay:1.8s; }
.card-c{ width:32%; height:27%; left:-4%; bottom:-4%; z-index:4; --r:-9deg; --delay:3.3s; }
.card-c .corner{width:12px; height:12px;}
.card-c .corner.tl{top:9px; left:9px;} .card-c .corner.br{bottom:9px; right:9px;}

.facet{position:absolute; width:9px; height:9px; z-index:5; opacity:.5; pointer-events:none;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold));
  animation:twinkle 3.8s ease-in-out infinite;
}
.facet.f1{top:4%; left:-4%; transform:rotate(45deg);animation-delay:.4s;}
.facet.f2{bottom:16%; right:2%; transform:rotate(45deg); animation-delay:2s;}
@keyframes twinkle{
  0%,100%{ opacity:.22; transform:rotate(45deg) scale(.8); }
  50%{ opacity:.85; transform:rotate(45deg) scale(1.15); }
}
.stack-inner{position:relative; width:100%; height:100%;}
@media(hover:hover){
  .hero-stack{ perspective:1000px; }
  .stack-inner{ transform-style:preserve-3d; transition:transform .5s var(--ease); }
}

.hero-scroll{
  position:absolute; bottom:34px; left:var(--gutter); z-index:2;
  display:flex; align-items:center; gap:12px;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ivory); opacity:.55;
}
.hero-scroll .stem{width:1px; height:38px; background:linear-gradient(180deg,var(--gold),transparent); position:relative; overflow:hidden;}
.hero-scroll .stem::after{content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--gold-soft); animation:drip 2.4s ease-in-out infinite;}
@keyframes drip{ 0%{top:-100%;} 100%{top:100%;} }

/* ============================================================
   MARQUEE (divisions strip)
   ============================================================ */
.marquee-wrap{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:18px 0; background:var(--panel); overflow:hidden;}
.marquee{display:flex; white-space:nowrap; width:max-content; animation:scrollX 32s linear infinite;}
.marquee span{
  font-family:var(--font-display); font-size:18px; color:var(--ivory); opacity:.5; padding:0 34px;
  display:inline-flex; align-items:center; gap:34px;
}
.marquee span::after{content:'?'; color:var(--gold); opacity:.7; font-size:12px;}
@keyframes scrollX{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ============================================================
   SECTION BASE
   ============================================================ */
section{position:relative; padding:150px 0;}
.section-head{max-width:640px; margin-bottom:80px;}
.section-head h2{font-size:clamp(32px,4.4vw,54px); color:var(--white); line-height:1.08;}
.section-head .lead{margin-top:20px; font-size:16.5px; color:var(--ivory); opacity:.72; max-width:560px;}
.reveal{opacity:0; transform:translateY(36px); transition:opacity 1s var(--ease), transform 1s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}
.reveal-scale{opacity:0; transform:scale(.94); transition:opacity 1.1s var(--ease), transform 1.1s var(--ease);}
.reveal-scale.in{opacity:1; transform:scale(1);}
.stagger > *{transition-delay:calc(var(--i,0) * 90ms);}

/* ============================================================
   ABOUT
   ============================================================ */
.about{background:linear-gradient(180deg,var(--black), #121012);}
.about-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px; align-items:start;}
.about-visual{
  position:relative; aspect-ratio:4/5; border-radius:2px; overflow:hidden;
  background:
    radial-gradient(circle at 30% 20%, rgba(200,155,60,0.25), transparent 55%),
    linear-gradient(160deg, #201c17, #0c0b0a 70%);
  border:1px solid var(--line-strong);
}
.about-visual svg{position:absolute; inset:0; width:100%; height:100%;}
.about-visual .frame-label{
  position:absolute; bottom:24px; left:24px; right:24px;
  display:flex; justify-content:space-between; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-soft); opacity:.8;
}
.about-copy p{color:var(--ivory); opacity:.82; font-size:16px; margin-bottom:20px; max-width:560px;}
.value-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:50px; background:var(--line); border:1px solid var(--line);}
.value-card{background:var(--black); padding:30px 24px;}
.value-card h4{font-family:var(--font-display); font-size:19px; color:var(--white); margin-bottom:10px;}
.value-card p{font-size:13.5px; opacity:.65; color:var(--ivory);}

.chairman{margin-top:110px; display:grid; grid-template-columns:0.7fr 1.3fr; gap:60px; align-items:center; border-top:1px solid var(--line); padding-top:80px;}
.chairman-quote{font-family:var(--font-display); font-size:clamp(22px,2.6vw,32px); font-weight:400; color:var(--white); line-height:1.4; font-style:italic;}
.chairman-quote::before{content:'“'; color:var(--gold); font-size:1.3em; margin-right:4px;}
.chairman-sign{margin-top:26px; display:flex; align-items:center; gap:16px;}
.chairman-sign .line{width:44px; height:1px; background:var(--gold);}
.chairman-sign strong{display:block; font-size:14px; color:var(--white); letter-spacing:.04em;}
.chairman-sign span{font-size:12px; color:var(--ivory); opacity:.6;}
.chairman-portrait{
  aspect-ratio:1/1; border-radius:50%; border:1px solid var(--line-strong); max-width:220px;
  background:radial-gradient(circle at 35% 25%, #2a241d, #0c0b0a 75%);
  display:flex; align-items:center; justify-content:center;
}
.chairman-portrait svg{width:52%; opacity:.55;}

/* ---------- Stats ---------- */
.stats{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:70px 0; margin-top:110px;}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:40px;}
.stat h3{font-family:var(--font-display); font-size:clamp(36px,4.4vw,58px); color:var(--gold-soft); display:flex; align-items:baseline; gap:2px;}
.stat span.suffix{font-size:.5em; color:var(--gold);}
.stat p{margin-top:10px; font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ivory); opacity:.6;}

/* ============================================================
   DIVISIONS
   ============================================================ */
.divisions{background:var(--black);}
.division-list{border-top:1px solid var(--line);}
.division-row{
  display:grid; grid-template-columns:80px 1fr auto; align-items:center; gap:30px;
  padding:38px 0; border-bottom:1px solid var(--line);
  cursor:pointer; position:relative; overflow:hidden;
  transition: padding var(--dur-s) var(--ease);
}
.division-row .num{font-family:var(--font-display); font-size:15px; color:var(--gold); opacity:.7;}
.division-row h3{font-size:clamp(24px,3vw,40px); color:var(--white); transition:transform var(--dur-m) var(--ease), color var(--dur-s) var(--ease);}
.division-row p{max-width:420px; font-size:14px; color:var(--ivory); opacity:0; max-height:0; overflow:hidden; transition:opacity var(--dur-s) var(--ease);}
.division-row .arrow{width:38px; height:38px; border:1px solid var(--line-strong); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all var(--dur-s) var(--ease); flex:none;}
.division-row .arrow svg{width:14px; height:14px; stroke:var(--gold); transition:transform var(--dur-s) var(--ease);}
.division-row::before{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--gold);
  transition:width .6s var(--ease);
}
.division-row:hover{padding-left:14px;}
.division-row:hover::before{width:100%;}
.division-row:hover h3{color:var(--gold-soft); transform:translateX(6px);}
.division-row:hover .arrow{background:var(--gold); border-color:var(--gold);}
.division-row:hover .arrow svg{stroke:var(--black); transform:rotate(45deg);}
.division-row:hover p{opacity:.68; max-height:60px;}

/* ============================================================
   SHOWCASE GALLERY
   ============================================================ */
.showcase{background:linear-gradient(180deg,#121012,var(--black));}
.gallery{display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:120px; gap:14px; margin-top:20px;}
.g-item{position:relative; overflow:hidden; border-radius:2px; border:1px solid var(--line);}
.g-item svg,.g-item .fill{position:absolute; inset:0; width:100%; height:100%; transition:transform 1.1s var(--ease);}
.g-item:hover svg, .g-item:hover .fill{transform:scale(1.08);}
.g-item .cap{position:absolute; left:16px; bottom:14px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--white); opacity:0; transform:translateY(8px); transition:all var(--dur-s) var(--ease);}
.g-item:hover .cap{opacity:1; transform:translateY(0);}
.g-item::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%, rgba(0,0,0,.65)); opacity:0; transition:opacity var(--dur-s);}
.g-item:hover::after{opacity:1;}
.g1{grid-column:span 3; grid-row:span 3;}
.g2{grid-column:span 3; grid-row:span 2;}
.g3{grid-column:span 3; grid-row:span 2;}
.g4{grid-column:span 2; grid-row:span 2;}
.g5{grid-column:span 2; grid-row:span 2;}
.g6{grid-column:span 2; grid-row:span 2;}
@media(max-width:900px){
  .gallery{grid-template-columns:repeat(2,1fr); grid-auto-rows:160px;}
  .g1,.g2,.g3,.g4,.g5,.g6{grid-column:span 2; grid-row:span 2;}
}

/* ============================================================
   INVESTMENT
   ============================================================ */
.invest{background:var(--black);}
.invest-grid{display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;}
.invest-copy p{color:var(--ivory); opacity:.78; font-size:16px; margin-bottom:18px;}
.reasons{margin-top:34px; display:flex; flex-direction:column; gap:22px;}
.reason{display:flex; gap:18px; align-items:flex-start;}
.reason .ico{width:38px; height:38px; border:1px solid var(--line-strong); border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;}
.reason .ico svg{width:16px; height:16px; stroke:var(--gold);}
.reason h4{font-size:15.5px; color:var(--white); font-family:var(--font-body); font-weight:700; margin-bottom:4px;}
.reason p{font-size:13.5px; opacity:.62;}

.chart-card{
  border:1px solid var(--line-strong); background:var(--panel); border-radius:2px; padding:36px;
}
.chart-card .top{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:26px;}
.chart-card .top h4{font-family:var(--font-body); font-weight:700; color:var(--white); font-size:14px; letter-spacing:.08em; text-transform:uppercase;}
.chart-card .top span{font-size:12px; color:var(--emerald);}
.bars{display:flex; align-items:flex-end; gap:14px; height:180px;}
.bars .bar{flex:1; background:linear-gradient(180deg,var(--gold-soft),var(--gold) 60%,var(--gold-deep)); border-radius:2px 2px 0 0; height:0; transition:height 1.6s var(--ease); position:relative;}
.bars .bar span{position:absolute; top:-24px; left:0; right:0; text-align:center; font-size:11px; color:var(--ivory); opacity:.6;}
.chart-foot{display:flex; justify-content:space-between; margin-top:14px; font-size:11px; color:var(--ivory); opacity:.45; letter-spacing:.05em;}

/* ============================================================
   TIMELINE
   ============================================================ */
.timeline-wrap{position:relative;}
.timeline-line{position:absolute; left:50%; top:0; bottom:0; width:1px; background:var(--line-strong); transform:translateX(-50%);}
.timeline-fill{position:absolute; left:50%; top:0; width:1px; background:var(--gold); transform:translateX(-50%); height:0; transition:height .3s linear;}
.t-item{position:relative; display:grid; grid-template-columns:1fr 60px 1fr; gap:0; margin-bottom:70px; align-items:center;}
.t-item .dot{width:11px; height:11px; border-radius:50%; background:var(--black); border:1.5px solid var(--gold); margin:0 auto; position:relative; z-index:2; transition:background .4s;}
.t-item.in .dot{background:var(--gold);}
.t-card{max-width:400px; padding:26px 30px; border:1px solid var(--line); background:var(--panel);}
.t-item:nth-child(odd) .t-card{margin-left:auto; text-align:right;}
.t-item:nth-child(even){direction:rtl;}
.t-item:nth-child(even) .t-card{direction:ltr; text-align:left;}
.t-year{font-family:var(--font-display); color:var(--gold-soft); font-size:26px;}
.t-card h4{margin-top:8px; font-size:16px; color:var(--white); font-family:var(--font-body); font-weight:700;}
.t-card p{margin-top:8px; font-size:13.5px; opacity:.65;}
@media(max-width:800px){
  .t-item, .t-item:nth-child(even){grid-template-columns:40px 1fr; direction:ltr;}
  .t-item:nth-child(odd) .t-card, .t-item:nth-child(even) .t-card{margin-left:0; text-align:left;}
  .timeline-line, .timeline-fill{left:19px;}
  .t-item .dot{grid-column:1;}
  .t-card{grid-column:2; max-width:100%;}
}

/* ============================================================
   PROCESS
   ============================================================ */
.process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); position:relative;}
.p-step{background:var(--black); padding:44px 30px; position:relative;}
.p-step .p-num{font-family:var(--font-display); font-size:14px; color:var(--gold); opacity:.7; margin-bottom:20px;}
.p-step h4{font-size:19px; color:var(--white); margin-bottom:12px;}
.p-step p{font-size:13.5px; opacity:.62;}
.p-step:not(:last-child)::after{
  content:''; position:absolute; right:-1px; top:50%; width:14px; height:1px; background:var(--gold); z-index:2; display:none;
}
@media(min-width:800px){ .p-step:not(:last-child)::after{display:block;} }
@media(max-width:800px){ .process-grid{grid-template-columns:1fr;} }

/* ============================================================
   WHY US
   ============================================================ */
.feature-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:34px;}
.feature{padding:34px 0; border-top:1px solid var(--line-strong);}
.feature svg{width:30px; height:30px; stroke:var(--gold); margin-bottom:22px;}
.feature h4{font-size:17px; color:var(--white); margin-bottom:10px;}
.feature p{font-size:13.5px; opacity:.6;}
@media(max-width:900px){.feature-grid{grid-template-columns:repeat(2,1fr);}}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testi-wrap{position:relative; max-width:760px; margin:0 auto; text-align:center;}
.testi-slide{display:none;}
.testi-slide.active{display:block; animation:fadeUp .8s var(--ease);}
.testi-slide .stars{color:var(--gold); letter-spacing:4px; margin-bottom:26px; font-size:14px;}
.testi-slide blockquote{font-family:var(--font-display); font-size:clamp(20px,2.6vw,30px); font-weight:400; font-style:italic; color:var(--white); line-height:1.5; margin:0;}
.testi-who{margin-top:30px; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-soft);}
.testi-dots{display:flex; gap:10px; justify-content:center; margin-top:44px;}
.testi-dots button{width:8px; height:8px; border-radius:50%; border:1px solid var(--gold); background:transparent; padding:0;}
.testi-dots button.active{background:var(--gold);}

/* ---------- Clients marquee ---------- */
.clients-strip{margin-top:110px; border-top:1px solid var(--line); padding-top:60px;}
.clients-strip .label{text-align:center; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ivory); opacity:.45; margin-bottom:40px;}
.clients-row{display:flex; gap:70px; align-items:center; overflow:hidden; width:max-content; animation:scrollX 26s linear infinite;}
.clients-row span{font-family:var(--font-display); font-size:22px; letter-spacing:.03em; color:var(--ivory); opacity:.35; white-space:nowrap;}

/* ============================================================
   CSR
   ============================================================ */
.csr{background:linear-gradient(180deg,var(--black),#131110);}
.csr-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;}
.csr-gallery{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.csr-gallery .g-item:first-child{grid-column:1/3; aspect-ratio:16/8;}
.csr-gallery .g-item{aspect-ratio:1/1;}
.csr-stats{display:flex; gap:50px; margin-top:36px;}
.csr-stats .stat h3{font-size:34px;}

/* ============================================================
   FAQ
   ============================================================ */
.faq-list{border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%; background:none; border:none; text-align:left; color:var(--white);
  padding:30px 0; display:flex; justify-content:space-between; align-items:center; gap:20px;
  font-family:var(--font-display); font-size:19px;
}
.faq-q .plus{width:26px; height:26px; position:relative; flex:none;}
.faq-q .plus::before,.faq-q .plus::after{content:''; position:absolute; background:var(--gold); top:50%; left:50%; transform:translate(-50%,-50%);}
.faq-q .plus::before{width:14px; height:1px;}
.faq-q .plus::after{width:1px; height:14px; transition:transform var(--dur-s) var(--ease);}
.faq-item.open .plus::after{transform:translate(-50%,-50%) rotate(90deg) scaleY(0);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .5s var(--ease);}
.faq-a p{padding:0 0 30px; max-width:640px; font-size:14.5px; color:var(--ivory); opacity:.68;}

/* ============================================================
   CONTACT
   ============================================================ */
.contact{background:var(--black); position:relative;}
.contact-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px;}
.contact-info .item{margin-bottom:34px;}
.contact-info .item span.label{display:block; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:8px;}
.contact-info .item p, .contact-info .item a{font-size:16px; color:var(--white);}
.map-plate{margin-top:40px; aspect-ratio:16/9; border:1px solid var(--line-strong); position:relative; overflow:hidden; background:var(--panel);}
.map-plate svg{position:absolute; inset:0; width:100%; height:100%; opacity:.5;}
.map-plate .pin{position:absolute; top:44%; left:52%; width:14px; height:14px; border-radius:50% 50% 50% 0; background:var(--gold); transform:rotate(-45deg); box-shadow:0 0 0 6px rgba(200,155,60,.15);}

.field{position:relative; margin-bottom:30px;}
.field input, .field textarea, .field select{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--line-strong);
  color:var(--white); font-family:var(--font-body); font-size:16px; padding:14px 0; outline:none;
  transition:border-color var(--dur-s);
}
.field select option{background:var(--black);}
.field label{
  position:absolute; left:0; top:14px; font-size:16px; color:var(--ivory); opacity:.5; pointer-events:none;
  transition:all var(--dur-s) var(--ease);
}
.field input:focus + label, .field input:not(:placeholder-shown) + label,
.field textarea:focus + label, .field textarea:not(:placeholder-shown) + label{
  top:-14px; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold);
}
.field input:focus, .field textarea:focus{border-color:var(--gold);}
.field textarea{resize:vertical; min-height:80px;}
.form-note{font-size:12px; opacity:.5; margin-top:6px;}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:#0A0A0B; border-top:1px solid var(--line); padding-top:100px;}
.footer-top{display:grid; grid-template-columns:1.3fr 0.8fr 0.8fr 1fr; gap:60px; padding-bottom:80px; border-bottom:1px solid var(--line);}
.footer-brand img{height:38px; margin-bottom:22px;}
.footer-brand p{font-size:14px; opacity:.55; max-width:280px; margin-bottom:26px;}
.social-row{display:flex; gap:12px;}
.social-row a{width:36px; height:36px; border:1px solid var(--line-strong); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all var(--dur-s);}
.social-row a:hover{background:var(--gold); border-color:var(--gold);}
.social-row a svg{width:14px; height:14px; stroke:var(--gold-soft);}
.social-row a:hover svg{stroke:var(--black);}
.foot-col h5{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:22px;}
.foot-col a, .foot-col p{display:block; font-size:14px; color:var(--ivory); opacity:.62; margin-bottom:13px;}
.foot-col a:hover{opacity:1; color:var(--gold-soft);}
.newsletter-row{display:flex; border-bottom:1px solid var(--line-strong); padding-bottom:10px; margin-top:6px;}
.newsletter-row input{flex:1; background:none; border:none; color:var(--white); font-size:14px; outline:none;}
.newsletter-row button{background:none; border:none; color:var(--gold); font-size:12px; letter-spacing:.1em; text-transform:uppercase;}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding:26px 0; font-size:12px; opacity:.45; flex-wrap:wrap; gap:14px;}
.footer-bottom .legal{display:flex; gap:24px;}

/* ---------- Floating actions ---------- */
.floaters{position:fixed; right:26px; bottom:26px; z-index:700; display:flex; flex-direction:column; gap:14px; align-items:center;}
.floaters button, .floaters a{
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--gold); background:var(--black); transition:all var(--dur-s) var(--ease);
}
.floaters .wa{background:var(--emerald); border-color:var(--emerald);}
.floaters svg{width:20px; height:20px; stroke:var(--gold-soft);}
.floaters .wa svg{stroke:var(--white);}
.floaters button:hover, .floaters a:hover{transform:translateY(-4px); box-shadow:0 10px 30px rgba(200,155,60,.2);}
#toTop{opacity:0; pointer-events:none; transform:scale(.8);}
#toTop.show{opacity:1; pointer-events:auto; transform:scale(1);}

/* ---------- Responsive ---------- */
@media(max-width:1080px){
  .about-grid,.chairman,.invest-grid,.csr-grid,.contact-grid{grid-template-columns:1fr;}
  .about-visual{max-width:420px;}
  .chairman-portrait{margin-bottom:20px;}
  .stats-grid,.feature-grid{grid-template-columns:repeat(2,1fr);}
  .process-grid{grid-template-columns:repeat(2,1fr);}
  .footer-top{grid-template-columns:1fr 1fr; row-gap:50px;}
  nav.links, .nav-cta .btn{display:none;}
  .burger{display:flex;}
}
@media(max-width:640px){
  section{padding:100px 0;}
  .hero{padding-top:130px;}
  .hero-grid{grid-template-columns:1fr; gap:44px;}
  .hero-sub{margin-top:26px; padding-top:20px;}
  .hero-stack{max-width:280px; justify-self:center;}
  .value-grid{grid-template-columns:1fr;}
  .stats-grid,.feature-grid,.process-grid{grid-template-columns:1fr;}
  .division-row{grid-template-columns:40px 1fr auto; padding:26px 0;}
  .division-row p{display:none;}
  .footer-top{grid-template-columns:1fr;}
}