/* Shared stylesheet for the sub-pages (/about, /faq, /hire-a-content-strategist-in-india).
   Same design tokens as index.html so the new pages read as one site.
   Kept as a separate file so all sub-pages update together. */

:root{
  --paper:#F1F0EC;
  --ink:#141312;
  --white:#FFFFFF;
  --grey:#E5E3DD;
  --muted:#7A766E;

  --display:"Anton",Impact,sans-serif;
  --grotesk:"Space Grotesk",system-ui,sans-serif;
  --body:"Inter",system-ui,sans-serif;

  --frame:1.5px solid var(--ink);
  --pad:clamp(20px,4vw,56px);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
  padding:clamp(14px,2.5vw,30px);
}
a{color:inherit;}

.frame{max-width:1200px;margin:0 auto;border:var(--frame);border-radius:10px;background:var(--paper);overflow:hidden;}
.sec{border-bottom:var(--frame);padding:var(--pad);}
.sec:last-child{border-bottom:none;}

.display{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.005em;line-height:.9;}
.label{font-family:var(--grotesk);font-weight:600;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;}

/* nav */
nav{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px clamp(18px,3vw,32px);border-bottom:var(--frame);
  font-family:var(--grotesk);font-weight:600;font-size:12px;
  letter-spacing:.13em;text-transform:uppercase;
}
nav a{text-decoration:none;opacity:.75;transition:opacity .2s ease;}
nav a:hover{opacity:1;}
nav .nav-left,nav .nav-right{display:flex;align-items:center;gap:18px;}
.wordmark-nav{font-family:var(--display);font-size:15px;letter-spacing:.04em;text-transform:uppercase;}
@media(max-width:720px){
  nav{flex-wrap:wrap;justify-content:center;gap:10px 16px;}
  .wordmark-nav{order:-1;width:100%;text-align:center;}
}

/* page header */
.page-head{padding:clamp(36px,7vw,80px) var(--pad) clamp(28px,5vw,56px);border-bottom:var(--frame);}
.page-head h1{
  font-family:var(--display);text-transform:uppercase;font-weight:400;
  font-size:clamp(34px,6.4vw,74px);line-height:.94;margin:14px 0 0;max-width:16ch;
}
.page-head .kicker{color:var(--muted);font-size:clamp(15px,1.6vw,19px);margin:18px 0 0;max-width:62ch;}
.stamp{font-family:var(--grotesk);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:22px;}

/* prose */
.prose{max-width:74ch;}
.prose h2{
  font-family:var(--grotesk);font-weight:700;
  font-size:clamp(20px,2.5vw,27px);line-height:1.25;
  margin:44px 0 12px;
}
.prose h2:first-child{margin-top:0;}
.prose h3{font-family:var(--grotesk);font-weight:600;font-size:17px;margin:30px 0 8px;}
.prose p{margin:0 0 15px;}
.prose ul,.prose ol{margin:0 0 18px;padding-left:22px;}
.prose li{margin-bottom:8px;}
.prose strong{font-weight:600;}
.lede{font-size:clamp(17px,1.9vw,20px);line-height:1.5;}

/* Q&A blocks — the extractable unit. Question as a real heading, answer
   as plain paragraphs immediately below. No accordions: content that needs
   a click to render is content an answer engine will not read. */
.qa{border-top:var(--frame);padding:28px 0 4px;}
.qa:first-of-type{border-top:none;padding-top:0;}
.qa h2{
  font-family:var(--grotesk);font-weight:700;
  font-size:clamp(18px,2.2vw,24px);line-height:1.3;margin:0 0 12px;max-width:44ch;
}
.qa p{margin:0 0 14px;max-width:74ch;}

/* facts table */
.facts{width:100%;border-collapse:collapse;margin:8px 0 4px;font-size:15px;}
.facts th,.facts td{text-align:left;padding:11px 14px 11px 0;border-bottom:1px solid var(--grey);vertical-align:top;}
.facts th{font-family:var(--grotesk);font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);width:210px;white-space:nowrap;}
@media(max-width:620px){
  .facts th{width:auto;display:block;border:none;padding-bottom:2px;}
  .facts td{display:block;padding-top:0;}
}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--grotesk);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  background:var(--ink);color:var(--paper);text-decoration:none;
  padding:14px 24px;border:1.5px solid var(--ink);border-radius:6px;
  transition:background .2s ease,color .2s ease,transform .2s ease;cursor:pointer;
}
.btn:hover{background:transparent;color:var(--ink);transform:translateY(-2px);}
.btn.ghost{background:transparent;color:var(--ink);}
.btn.ghost:hover{background:var(--ink);color:var(--paper);}

/* footer */
.footrow{
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:18px clamp(18px,3vw,32px);
  font-family:var(--grotesk);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
}
.footrow a{text-decoration:none;}
.footrow a:hover{color:var(--ink);}
.footnav{display:flex;gap:16px;flex-wrap:wrap;}
.closer{
  font-family:var(--display);text-transform:uppercase;text-align:center;
  font-size:clamp(40px,11vw,150px);line-height:.9;padding:clamp(24px,4vw,54px) 12px;
  border-bottom:var(--frame);
}
