/* ============================================================
   R Square Consulting Ltd — shared stylesheet
   Typefaces: Fraunces (display) + Plus Jakarta Sans (body/UI)
   Palette: ink / off-white grounds, blue + teal + amber accents
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root{
  --white:#ffffff;
  --off:#f9f8f6;
  --off2:#f0ede8;
  --ink:#16150f;
  --ink2:#4a4740;
  --ink3:#908d87;
  --blue:#1847f0;
  --blue-lt:#e8edfe;
  --teal:#00b896;
  --teal-lt:#e0f7f3;
  --amber:#e8870a;
  --amber-lt:#fef3e0;
  --border:#e4e0d8;
  --border2:#cdc9c0;
  --r:6px;
  --r2:14px;
  --shadow:0 2px 12px rgba(22,21,15,0.07);
  --shadow2:0 8px 40px rgba(22,21,15,0.10);
}

html{ scroll-behavior:smooth; }

body{
  font-family:'Plus Jakarta Sans', sans-serif;
  background:var(--white);
  color:var(--ink2);
  font-size:16px;
  line-height:1.65;
  overflow-x:hidden;
}

a{ color:inherit; }
img{ max-width:100%; display:block; }
ul{ list-style:none; }

h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  color:var(--ink);
  font-weight:700;
  letter-spacing:-0.02em;
  line-height:1.15;
  text-wrap:balance;
}

.wrap{ max-width:1180px; margin:0 auto; padding:0 3.5rem; }

/* ---------- Nav ---------- */
nav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 3.5rem;
  background:rgba(249,248,246,0.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
}
.logo-wrap{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.logo-mark{
  width:38px; height:38px; border-radius:9px;
  background:linear-gradient(145deg,var(--blue),#0d2fb8);
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:700; color:#fff; font-size:1.05rem;
  flex-shrink:0;
}
.logo-word{ display:flex; flex-direction:column; gap:1px; }
.logo-name{ font-family:'Fraunces',serif; font-weight:700; font-size:1.12rem; color:var(--ink); letter-spacing:-0.02em; line-height:1; }
.logo-tag{ font-size:0.56rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink3); line-height:1; }
.nav-links{ display:flex; align-items:center; gap:2.2rem; }
.nav-links a{ text-decoration:none; font-size:0.86rem; font-weight:500; color:var(--ink2); transition:color 0.2s; }
.nav-links a:hover, .nav-links a.active{ color:var(--blue); }
.nav-cta{
  background:var(--blue); color:#fff; padding:0.6rem 1.3rem; border-radius:var(--r);
  font-size:0.84rem; font-weight:600; text-decoration:none; transition:all 0.2s;
}
.nav-cta:hover{ background:#0d35d4; transform:translateY(-1px); box-shadow:0 4px 20px rgba(24,71,240,0.28); }
.nav-menu-btn{ display:none; }

/* ---------- Hero ---------- */
.hero{
  background:var(--off);
  padding:9.5rem 3.5rem 5.5rem;
  position:relative; overflow:hidden;
}
.hero-dots{
  position:absolute; inset:0;
  background-image:radial-gradient(circle,var(--border2) 1px,transparent 1px);
  background-size:28px 28px; opacity:0.45;
}
.hero-glow{ position:absolute; top:-120px; right:-100px; width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle,rgba(24,71,240,0.08) 0%,transparent 70%); }
.hero-glow2{ position:absolute; bottom:-140px; left:8%; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle,rgba(0,184,150,0.07) 0%,transparent 70%); }
.hero-inner{ position:relative; z-index:2; max-width:760px; }
.hero-inner.wide{ max-width:820px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--blue-lt); border:1px solid rgba(24,71,240,0.18);
  padding:0.35rem 0.9rem; border-radius:100px;
  font-size:0.75rem; font-weight:600; color:var(--blue); letter-spacing:0.03em;
  margin-bottom:1.8rem;
}
.eyebrow::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--teal); }
.hero h1{ font-size:clamp(2.4rem,4.6vw,3.9rem); margin-bottom:1.4rem; }
.hero h1 em{ font-style:italic; color:var(--blue); }
.hero h1 .tc{ color:var(--teal); font-style:italic; }
.hero-sub{ font-size:1.08rem; color:var(--ink2); line-height:1.75; font-weight:300; max-width:640px; margin-bottom:2.3rem; }
.hero-btns{ display:flex; gap:1rem; flex-wrap:wrap; align-items:center; }

.btn-blue{
  background:var(--blue); color:#fff; padding:0.85rem 2rem; border-radius:var(--r);
  font-size:0.92rem; font-weight:600; text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  transition:all 0.2s;
}
.btn-blue:hover{ background:#0d35d4; transform:translateY(-2px); box-shadow:0 6px 24px rgba(24,71,240,0.28); }
.btn-line{
  color:var(--ink2); font-size:0.92rem; font-weight:500; text-decoration:none;
  display:inline-flex; align-items:center; gap:7px; padding:0.85rem 0; transition:color 0.2s;
}
.btn-line:hover{ color:var(--blue); }
.btn-line::after{ content:'→'; transition:transform 0.2s; }
.btn-line:hover::after{ transform:translateX(4px); }
.btn-dark{
  background:var(--ink); color:#fff; padding:0.85rem 2rem; border-radius:var(--r);
  font-size:0.92rem; font-weight:600; text-decoration:none; transition:all 0.2s; display:inline-flex; align-items:center; gap:8px;
}
.btn-dark:hover{ background:#2a2820; transform:translateY(-2px); box-shadow:0 6px 24px rgba(22,21,15,0.2); }
.btn-outline{
  border:1.5px solid rgba(24,71,240,0.3); color:var(--blue); padding:0.83rem 1.8rem; border-radius:var(--r);
  font-size:0.92rem; font-weight:600; text-decoration:none; background:var(--white); transition:all 0.2s;
}
.btn-outline:hover{ border-color:var(--blue); box-shadow:0 0 0 3px rgba(24,71,240,0.1); }

/* ---------- Sections ---------- */
section{ padding:5.5rem 3.5rem; }
.sec-label{ display:inline-block; font-size:0.72rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--blue); margin-bottom:0.9rem; }
.sec-title{ font-size:clamp(1.7rem,3.2vw,2.5rem); margin-bottom:1rem; }
.sec-sub{ font-size:1rem; color:var(--ink2); max-width:620px; line-height:1.8; font-weight:300; }
.sec-head{ margin-bottom:3rem; }
.sec-head.split{ display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; flex-wrap:wrap; }

.band-off{ background:var(--off); }
.band-off2{ background:var(--off2); }

.lede{ font-size:1.05rem; color:var(--ink2); line-height:1.85; font-weight:300; max-width:760px; }
.lede + .lede{ margin-top:1.1rem; }

/* ---------- Card grids ---------- */
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; }
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; }
.card{ background:var(--white); padding:2rem; transition:background 0.2s; position:relative; }
.card:hover{ background:var(--off); }
.card-num{ font-family:'Fraunces',serif; font-size:1.5rem; font-weight:300; color:var(--border2); margin-bottom:0.9rem; line-height:1; }
.card h3{ font-size:1.05rem; margin-bottom:0.6rem; }
.card p{ font-size:0.89rem; line-height:1.75; font-weight:300; }

/* ---------- Numbered list (services / outcomes / project types) ---------- */
.num-list{ display:flex; flex-direction:column; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; }
.num-item{ background:var(--white); padding:1.9rem 2.2rem; display:grid; grid-template-columns:52px 1fr; gap:1.3rem; }
.num-item .n{ font-family:'Fraunces',serif; font-size:1.3rem; font-weight:300; color:var(--border2); line-height:1.2; }
.num-item h3{ font-size:1.02rem; margin-bottom:0.5rem; }
.num-item p{ font-size:0.9rem; line-height:1.78; font-weight:300; color:var(--ink2); }

/* ---------- Simple bullet list ---------- */
.check-list{ display:flex; flex-direction:column; gap:0.9rem; }
.check-list li{ display:flex; gap:11px; font-size:0.95rem; color:var(--ink2); font-weight:300; line-height:1.6; align-items:flex-start; }
.check-list li::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--blue); margin-top:9px; flex-shrink:0; }
.check-list b{ color:var(--ink); font-weight:600; }

/* ---------- Chips / badges ---------- */
.chip{ font-size:0.74rem; padding:5px 12px; border-radius:100px; border:1px solid var(--border); color:var(--ink2); font-weight:500; background:var(--white); }
.chip-row{ display:flex; flex-wrap:wrap; gap:8px; }
.badge-teal{ background:var(--teal-lt); color:#006b55; border-color:transparent; }
.badge-blue{ background:var(--blue-lt); color:#0d35d4; border-color:transparent; }
.badge-amber{ background:var(--amber-lt); color:#7a4500; border-color:transparent; }

/* ---------- Facts strip (ideal client profile) ---------- */
.facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; }
.fact{ background:var(--white); padding:1.7rem 1.6rem; }
.fact-label{ font-size:0.68rem; font-weight:700; letter-spacing:0.09em; text-transform:uppercase; color:var(--ink3); margin-bottom:0.55rem; }
.fact-val{ font-family:'Fraunces',serif; font-size:1.15rem; font-weight:700; color:var(--ink); line-height:1.3; }

/* ---------- Industry / client table ---------- */
.client-table{ display:flex; flex-direction:column; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; }
.client-row{ background:var(--white); display:grid; grid-template-columns:200px 1fr; gap:1.5rem; padding:1.1rem 1.8rem; align-items:baseline; }
.client-row .sector{ font-size:0.72rem; font-weight:700; letter-spacing:0.07em; text-transform:uppercase; color:var(--blue); }
.client-row .names{ font-size:0.95rem; color:var(--ink); font-weight:600; }

/* ---------- Two-path explore cards (home) ---------- */
.path-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.path-card{
  border-radius:var(--r2); padding:2.6rem; text-decoration:none; position:relative; overflow:hidden;
  border:1px solid var(--border); transition:transform 0.2s, box-shadow 0.2s;
  display:flex; flex-direction:column; min-height:260px;
}
.path-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow2); }
.path-card.dark{ background:var(--ink); border-color:var(--ink); }
.path-card.light{ background:var(--off); }
.path-icon{ width:46px; height:46px; border-radius:11px; display:flex; align-items:center; justify-content:center; margin-bottom:1.6rem; font-size:1.3rem; }
.path-card.dark .path-icon{ background:rgba(24,71,240,0.22); }
.path-card.light .path-icon{ background:var(--teal-lt); }
.path-card h3{ font-size:1.5rem; margin-bottom:0.7rem; }
.path-card.dark h3{ color:#fff; }
.path-card p{ font-size:0.92rem; line-height:1.75; font-weight:300; flex:1; }
.path-card.dark p{ color:rgba(255,255,255,0.6); }
.path-card.light p{ color:var(--ink2); }
.path-cta{ font-size:0.85rem; font-weight:600; display:inline-flex; align-items:center; gap:7px; margin-top:1.6rem; }
.path-card.dark .path-cta{ color:#7da4ff; }
.path-card.light .path-cta{ color:var(--blue); }
.path-tag{ position:absolute; top:2rem; right:2rem; font-size:0.66rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; padding:3px 10px; border-radius:100px; }
.path-card.light .path-tag{ background:var(--teal-lt); color:#006b55; }
.path-card.dark .path-tag{ background:rgba(0,184,150,0.18); color:#5fe0c5; }

/* ---------- CTA band ---------- */
.cta-sec{
  background:var(--blue-lt); border-top:1px solid rgba(24,71,240,0.12);
  padding:5.5rem 3.5rem; text-align:center; position:relative; overflow:hidden;
}
.cta-sec::before{ content:''; position:absolute; top:-100px; left:50%; transform:translateX(-50%); width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle,rgba(24,71,240,0.1) 0%,transparent 70%); }
.cta-sec .sec-title, .cta-sec .sec-sub{ position:relative; }
.cta-sec .sec-sub{ margin:0 auto 2.2rem; max-width:480px; }
.cta-sec .sec-label{ position:relative; }
.cta-btns{ display:flex; gap:1rem; justify-content:center; position:relative; flex-wrap:wrap; }

/* ---------- Footer ---------- */
footer{
  background:var(--ink); padding:2.8rem 3.5rem; display:flex; justify-content:space-between; align-items:center;
  border-top:1px solid rgba(255,255,255,0.06); flex-wrap:wrap; gap:1.5rem;
}
.foot-logo{ display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; }
.foot-logo .logo-name{ color:#fff; }
.foot-logo .logo-tag{ color:rgba(255,255,255,0.4); }
.foot-links{ display:flex; gap:2rem; flex-wrap:wrap; }
.foot-links a{ font-size:0.82rem; color:rgba(255,255,255,0.45); text-decoration:none; transition:color 0.2s; }
.foot-links a:hover{ color:rgba(255,255,255,0.9); }
.foot-copy{ font-size:0.76rem; color:rgba(255,255,255,0.3); }

/* ---------- Utility ---------- */
.mt-lg{ margin-top:3rem; }
.center{ text-align:center; }
.mx-auto{ margin-left:auto; margin-right:auto; }

/* ---------- Responsive ---------- */
@media(max-width:960px){
  nav{ padding:1rem 1.5rem; }
  .nav-links{ display:none; }
  .wrap{ padding:0 1.5rem; }
  .hero{ padding:8rem 1.5rem 3.5rem; }
  section{ padding:3.5rem 1.5rem; }
  .grid-3, .grid-2, .facts, .path-grid{ grid-template-columns:1fr; }
  .num-item{ grid-template-columns:36px 1fr; padding:1.5rem; }
  .client-row{ grid-template-columns:1fr; gap:0.4rem; }
  .sec-head.split{ flex-direction:column; align-items:flex-start; }
  footer{ flex-direction:column; text-align:center; }
  .foot-links{ justify-content:center; }
}