/* reneviksolar.com — Home rev 6's design, for all eight pages (brand.md sections 1 and 5). */
:root {
  --bliolet:#5619db; --bliolet-dark:#a58af3; --lemon:#fbf069;
  --paper:#f9f9f9; --ink:#333333; --night:#1a1a19; --night-ink:#ecebe4; --gold:#a89113; --card:#ffffff;
  --line:rgb(51 51 51 / .14); --wash:rgb(51 51 51 / .04); --night-line:rgb(236 235 228 / .16);
  --r1:14px; --r2:28px; --pill:999px; --max:1200px; --gutter:24px;
  --spring:cubic-bezier(.2,.8,.2,1.12); --ease:cubic-bezier(.22,.61,.36,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Lexend",sans-serif; font-weight:300; font-size:17px; line-height:1.7; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-family:"Anek Latin",sans-serif; font-weight:600; line-height:1.02; letter-spacing:-.035em; margin:0; text-wrap:balance; }
p { margin:0; }
strong,b { font-weight:400; }
a { color:var(--bliolet); text-underline-offset:5px; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid var(--bliolet); outline-offset:4px; }
img { max-width:100%; }
.wrap { width:calc(100% - var(--gutter)*2); max-width:var(--max); margin-inline:auto; }
.eyebrow { font-size:12px; font-weight:400; letter-spacing:.18em; text-transform:uppercase; }
.skip { position:absolute; left:-999px; top:8px; z-index:30; padding:10px 16px; background:var(--paper); border-radius:var(--r1); }
.skip:focus { left:16px; }

/* Floating glass navigation */
.nav { position:fixed; top:16px; left:50%; translate:-50% 0; width:calc(100% - 48px); max-width:var(--max); z-index:10; border-radius:var(--r1); background:rgb(249 249 249 / .9); transition:transform .45s var(--ease), opacity .3s; }
@supports (backdrop-filter:blur(20px)) { .nav { background:rgb(249 249 249 / .72); backdrop-filter:saturate(1.6) blur(20px); } }
.nav.tucked:not(:focus-within) { transform:translateY(-140px); opacity:0; }
.nav-in { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:12px 22px; min-height:64px; }
.nav-in img { width:124px; height:auto; display:block; }
.links { display:flex; gap:28px; }
.links a { color:var(--ink); text-decoration:none; font-size:13px; font-weight:400; padding-block:10px; transition:color .2s; }
.links a:hover,.links a[aria-current="page"] { color:var(--bliolet); }
.links .cta { color:var(--bliolet); }
.menu { display:none; background:none; border:0; font:inherit; font-size:13px; color:var(--ink); min-height:44px; cursor:pointer; }

/* Hero: full-bleed image, headline on it. Home is tall; inner pages are shorter. */
.hero { position:relative; height:min(100vh, 980px); min-height:640px; overflow:hidden; background:var(--night); color:var(--paper); }
.hero.inner { height:min(78vh, 760px); min-height:540px; }
.hero-img { position:absolute; inset:-4% 0 -10% 0; will-change:transform; }
.hero-img img { width:100%; height:100%; object-fit:cover; object-position:center 60%; display:block; }
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgb(26 26 25 / .15) 25%, rgb(26 26 25 / .82) 100%); }
.hero-copy { position:absolute; z-index:2; left:0; right:0; bottom:9vh; }
.hero h1 { font-size:clamp(68px,10vw,148px); color:var(--paper); }
.hero.inner h1 { font-size:clamp(44px,6.4vw,96px); max-width:16ch; }
.hero .eyebrow { color:var(--lemon); margin-bottom:18px; }
.hero .lead { max-width:720px; margin-top:24px; font-size:clamp(17px,1.6vw,21px); line-height:1.6; color:var(--paper); }
.hero .lead b { color:var(--lemon); }
.actions { display:flex; flex-wrap:wrap; gap:14px 26px; align-items:center; margin-top:34px; }
.btn { display:inline-flex; align-items:center; min-height:50px; padding:12px 26px; border-radius:var(--pill); background:var(--bliolet); color:var(--paper); text-decoration:none; font-size:14px; font-weight:400; border:0; cursor:pointer; font-family:inherit; transition:transform .45s var(--spring), background .2s; }
.btn:hover { transform:translateY(-2px) scale(1.02); }
.btn:active { transform:scale(.97); }
.btn.ghost { background:rgb(249 249 249 / .14); color:var(--paper); box-shadow:inset 0 0 0 1px rgb(249 249 249 / .5); }
.btn.line { background:none; color:var(--bliolet); box-shadow:inset 0 0 0 1px var(--bliolet); }
.illus { position:absolute; z-index:2; right:24px; bottom:18px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:rgb(249 249 249 / .75); }

/* Figures */
.figures { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; padding-block:72px; border-bottom:1px solid var(--line); }
.fig b { display:block; font-family:"Anek Latin",sans-serif; font-weight:600; font-size:clamp(40px,4.6vw,64px); line-height:1; letter-spacing:-.03em; color:var(--ink); }
.fig b small { font-size:.45em; letter-spacing:0; margin-left:4px; }
.fig p { margin-top:12px; font-size:14px; max-width:220px; }

/* Two-column sections: a sticky head, a body */
.story,.sec { display:grid; grid-template-columns:5fr 7fr; gap:96px; padding-block:140px; }
.sec + .sec { border-top:1px solid var(--line); }
.story-head,.sec-head { position:sticky; top:120px; align-self:start; }
.story-head h2,.sec-head h2 { font-size:clamp(36px,4.2vw,58px); margin-top:20px; }
.story-head p.sub,.sec-head p.sub { margin-top:24px; max-width:44ch; }
.sec-body > p + p { margin-top:20px; }
.sec-body > p.big { font-size:clamp(19px,1.7vw,22px); line-height:1.6; }
.progress { margin-top:40px; height:2px; background:var(--line); border-radius:2px; overflow:hidden; }
.progress i { display:block; height:100%; width:0; background:var(--bliolet); transition:width .25s linear; }
.steps { display:grid; gap:24px; }
.step { padding:44px 40px; border-radius:var(--r2); background:var(--card); box-shadow:0 1px 0 var(--line); transition:transform .5s var(--spring), box-shadow .3s; }
.step:hover { transform:translateY(-4px); box-shadow:0 18px 40px -24px rgb(26 26 25 / .35); }
.step .k { color:var(--bliolet); font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:400; }
.step h3 { font-size:clamp(44px,5vw,72px); margin-top:14px; }
.step p { margin-top:18px; max-width:52ch; }
.step ol { margin:22px 0 0; padding-left:20px; font-size:15px; }
.step li { margin-top:6px; }
.step a.more { display:inline-flex; margin-top:22px; font-size:14px; font-weight:400; text-decoration:none; min-height:44px; align-items:center; }
.step a.more:hover { text-decoration:underline; }

/* Numbered process and point lists */
.flow { list-style:none; margin:0; padding:0; counter-reset:f; display:grid; gap:0; }
.flow li { counter-increment:f; display:grid; grid-template-columns:56px 1fr; gap:20px; padding-block:26px; border-top:1px solid var(--line); }
.flow li::before { content:counter(f); font-family:"Anek Latin",sans-serif; font-weight:600; font-size:28px; line-height:1.2; color:var(--bliolet); }
.flow h3,.points h3 { font-size:22px; letter-spacing:-.01em; }
.flow p,.points p { margin-top:6px; font-size:15px; }
.points { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.points div { border-top:2px solid var(--ink); padding-top:20px; }
.aside { margin-top:32px; padding:20px 22px; border-radius:var(--r1); background:var(--wash); font-size:14px; }
.soon { display:inline-block; margin-left:8px; padding:1px 10px; border-radius:var(--pill); background:var(--lemon); color:var(--ink); font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:400; vertical-align:middle; }

/* Image band */
.band { position:relative; height:min(80vh, 760px); overflow:hidden; background:var(--night); }
.band .img { position:absolute; inset:-8% 0; will-change:transform; }
.band .img img { width:100%; height:100%; object-fit:cover; display:block; }
.band .illus { right:24px; bottom:16px; }

/* Dark platform section */
.vikas { background:var(--night); color:var(--night-ink); padding-block:150px; }
.vikas-grid { display:grid; grid-template-columns:5fr 7fr; gap:96px; }
.vikas h2.word { font-size:clamp(84px,12vw,176px); color:var(--bliolet-dark); letter-spacing:-.04em; }
.vikas h2 { font-size:clamp(36px,4.2vw,58px); color:var(--night-ink); }
.vikas .eyebrow { color:var(--night-ink); }
.vikas .lead { margin-top:28px; font-size:clamp(22px,2.2vw,30px); line-height:1.35; max-width:16ch; font-family:"Anek Latin",sans-serif; font-weight:600; letter-spacing:-.01em; }
.vikas .copy p + p { margin-top:22px; }
.vikas a { color:var(--bliolet-dark); }
.layers { margin-top:56px; display:grid; gap:0; }
.layer { display:grid; grid-template-columns:56px 1fr; gap:20px; padding-block:26px; border-top:1px solid var(--night-line); opacity:.35; transition:opacity .6s var(--ease); }
.layer.on { opacity:1; }
.layer .n { font-family:"Anek Latin",sans-serif; font-weight:600; font-size:28px; color:var(--bliolet-dark); }
.layer h3 { font-size:24px; letter-spacing:-.01em; }
.layer p { margin-top:8px; font-size:15px; }
.vikas .hi { color:var(--lemon); }
.vikas a.more { display:inline-flex; margin-top:36px; font-weight:400; text-decoration:none; min-height:44px; align-items:center; }
.vikas a.more:hover { text-decoration:underline; }
.views { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px; }
.views div { padding:28px; border-radius:var(--r2); border:1px solid var(--night-line); }
.views h3 { font-size:24px; color:var(--bliolet-dark); }
.views p { margin-top:10px; font-size:15px; }

/* Audiences */
.who { padding-block:150px; }
.who h2 { font-size:clamp(40px,4.6vw,64px); max-width:15ch; margin-top:20px; }
.who-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:72px; }
.who-grid div { border-top:2px solid var(--ink); padding-top:22px; }
.who-grid h3 { font-size:24px; letter-spacing:-.01em; }
.who-grid p { margin-top:12px; font-size:15px; }

/* Record and tables */
.record { padding-block:150px; border-top:1px solid var(--line); }
.rec-grid { display:grid; grid-template-columns:5fr 7fr; gap:80px; align-items:start; }
.record h2 { font-size:clamp(40px,4.6vw,64px); margin-top:20px; }
.record .sub { margin-top:24px; max-width:46ch; }
.p90 { margin-top:28px; padding:20px 22px; border-radius:var(--r1); background:var(--wash); font-size:14px; }
.board { padding:36px; border-radius:var(--r2); background:var(--card); box-shadow:0 30px 60px -40px rgb(26 26 25 / .35); }
.chips { display:flex; flex-wrap:wrap; gap:10px; }
.chip { font:inherit; font-size:13px; font-weight:400; padding:10px 18px; border-radius:var(--pill); border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer; min-height:44px; transition:background .25s, color .25s, transform .4s var(--spring); }
.chip:hover { transform:translateY(-1px); }
.chip[aria-pressed="true"] { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.plant-title { margin-top:28px; font-family:"Anek Latin",sans-serif; font-weight:600; font-size:26px; letter-spacing:-.01em; }
.plant-meta { font-size:13px; margin-top:4px; }
.chart { margin-top:24px; height:260px; display:flex; align-items:flex-end; gap:12px; position:relative; border-bottom:1px solid var(--line); }
.chart .ref { position:absolute; left:0; right:0; border-top:1px dashed var(--ink); opacity:.55; }
.chart .ref span { position:absolute; left:0; top:4px; font-size:11px; background:var(--card); padding-right:6px; }
.bar { flex:1; position:relative; height:0; background:var(--bliolet); border-radius:8px 8px 2px 2px; transition:height .9s var(--ease); }
.bar.low { background:var(--bliolet-dark); }
.bar .v { position:absolute; top:-24px; left:50%; translate:-50% 0; font-size:12px; font-weight:400; white-space:nowrap; }
.bar.flag .v { background:var(--lemon); padding:1px 6px; border-radius:6px; top:-28px; }
.labels { display:flex; gap:12px; margin-top:10px; }
.labels span { flex:1; text-align:center; font-size:12px; }
.note { margin-top:22px; font-size:14px; }
.board details { margin-top:16px; font-size:13px; }
.board summary { cursor:pointer; color:var(--bliolet); font-weight:400; min-height:44px; display:flex; align-items:center; }
table { border-collapse:collapse; width:100%; font-variant-numeric:tabular-nums; }
td,th { text-align:left; padding:8px 12px 8px 0; border-bottom:1px solid var(--line); font-weight:300; vertical-align:top; }
th { font-weight:400; font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.board td:last-child { text-align:right; }
.tbl { overflow-x:auto; padding:28px 32px; border-radius:var(--r2); background:var(--card); box-shadow:0 30px 60px -40px rgb(26 26 25 / .35); font-size:15px; }
.tbl table { min-width:620px; }
.tbl caption { text-align:left; font-size:13px; padding-bottom:12px; }
.plant { padding-block:30px; border-top:1px solid var(--line); }
.plant h3 { font-size:26px; letter-spacing:-.01em; }
.plant .meta { font-size:13px; margin-top:4px; }
.plant p + p,.plant .meta + p { margin-top:12px; }

/* Company: founder panel and people */
.founder { display:grid; grid-template-columns:5fr 7fr; gap:80px; padding:72px; border-radius:var(--r2); background:var(--night); color:var(--night-ink); margin-block:24px 140px; }
.founder h2 { font-size:clamp(36px,4.2vw,58px); color:var(--bliolet-dark); }
.founder p { font-size:clamp(18px,1.6vw,21px); line-height:1.6; }
.founder .hi { color:var(--lemon); }
.people { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.people div { border-top:2px solid var(--ink); padding-top:20px; }
.people h3 { font-size:24px; letter-spacing:-.01em; }
.people p { margin-top:6px; font-size:14px; }

/* Closing + form */
.closing { padding-block:150px; background:var(--wash); }
.closing-grid { display:grid; grid-template-columns:6fr 6fr; gap:80px; }
.closing h2 { font-size:clamp(44px,5.4vw,80px); margin-top:20px; }
.closing .sub { margin-top:24px; max-width:44ch; }
form { display:grid; gap:16px; }
label { display:grid; gap:6px; font-size:13px; font-weight:400; }
input,select,textarea { font:inherit; font-size:15px; font-weight:300; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--ink); }
textarea { min-height:110px; resize:vertical; }
.form-note { font-size:12px; }
.text { padding-block:160px 120px; max-width:760px; }
.text h1 { font-size:clamp(44px,6vw,80px); }
.text h2 { font-size:28px; margin-top:44px; }
.text p { margin-top:16px; }

footer { padding-block:56px; border-top:1px solid var(--line); font-size:13px; }
.foot { display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px; align-items:center; }
.foot img { width:120px; height:auto; display:block; }
.foot nav { display:flex; flex-wrap:wrap; gap:6px 22px; }
.foot nav a { color:var(--ink); text-decoration:none; min-height:32px; display:inline-flex; align-items:center; }
.outgoing { margin-top:36px; padding-top:22px; border-top:1px solid var(--line); font-size:12px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; }
.outgoing a { color:var(--ink); }

/* Reveal on scroll */
@media (prefers-reduced-motion:no-preference) {
  .js .rv { opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
  .js .rv.in { opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none !important; animation:none !important; }
  .hero-img,.band .img { transform:none !important; }
  .layer { opacity:1; }
}
@media (max-width:980px) {
  .story,.sec,.vikas-grid,.rec-grid,.closing-grid,.founder { grid-template-columns:1fr; gap:48px; }
  .story-head,.sec-head { position:static; }
  .who-grid,.people,.figures { grid-template-columns:1fr 1fr; }
  .views { grid-template-columns:1fr; }
}
@media (max-width:860px) {
  .menu { display:block; }
  .links { display:none; position:absolute; top:100%; left:0; right:0; margin-top:8px; padding:12px 22px; flex-direction:column; gap:0; background:var(--paper); border-radius:var(--r1); box-shadow:0 20px 40px -20px rgb(26 26 25 / .3); }
  .links.open { display:flex; }
  .links a { min-height:44px; display:flex; align-items:center; }
}
@media (max-width:700px) {
  body { font-size:16px; }
  .nav { top:12px; width:calc(100% - 24px); }
  .hero { min-height:600px; }
  .hero.inner { min-height:520px; }
  .story,.sec,.vikas,.who,.record,.closing { padding-block:96px; }
  .step { padding:32px 24px; }
  .who-grid,.people,.points { grid-template-columns:1fr; gap:32px; }
  .who-grid { margin-top:48px; }
  .board,.tbl { padding:24px 18px; }
  .founder { padding:40px 24px; margin-bottom:96px; }
  .chart { gap:6px; height:220px; }
  .labels { gap:6px; }
  .labels span,.bar .v { font-size:10px; }
  .band { height:56vh; }
  .illus { right:16px; }
}
