/* ============================================================
   Giero Consulting — shared styles for all pages
   Brand colors are defined once here, at the top.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Glegoo:wght@400;700&family=Montserrat:wght@400;500;600;700&display=swap');

:root{
  --pine:#153E1B;        /* dark green from the Giero wordmark */
  --pine-deep:#0D2A11;
  --paper:#FAFBF8;
  --card:#FFFFFF;
  --green:#048E15;       /* bright Giero green */
  --amber:#D9A441;
  --line:#DCE3DA;
  --ink-soft:#44573F;
  --radius:10px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Montserrat',system-ui,sans-serif;
  background:var(--paper);
  color:var(--pine);
  line-height:1.6;
  font-size:17px;
}
p{margin:0 0 1rem;}
.mono{font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;}
h1,h2,h3,h4,h5,h6{font-family:'Glegoo',serif;font-weight:400;line-height:1.12;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:2px;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

/* ---------- header: logo centered first, nav below on the left ---------- */
header{
  background:#fff;
  border-bottom:1px solid var(--line);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  padding:20px 24px 16px;
  position:relative;
}
.masthead{
  text-align:center;
  padding:0;
}
.masthead img{height:110px;width:auto;}
.tabs{align-self:flex-start;}
.tabs ul{display:flex;justify-content:flex-start;gap:36px;list-style:none;padding:0;flex-wrap:wrap;}
.tabs a{text-decoration:none;font-size:.95rem;font-weight:500;color:var(--ink-soft);padding-bottom:5px;}
.tabs a:hover{color:var(--pine);}
.tabs a.active{color:var(--pine);border-bottom:2px solid var(--green);}
.btn{
  display:inline-block;padding:11px 22px;border-radius:999px;
  text-decoration:none;font-weight:600;font-size:.92rem;
  background:var(--pine);color:var(--paper);border:1px solid var(--pine);
  transition:background .2s;cursor:pointer;
}
.btn:hover{background:var(--pine-deep);}
.btn.ghost{background:transparent;color:var(--pine);}
.btn.ghost:hover{background:rgba(21,62,27,.06);}

/* ---------- hero (home, centered) ---------- */
.hero-center{padding:88px 0 80px;text-align:center;}
.hero-center h1{font-size:clamp(2.6rem,5.6vw,4.2rem);margin:18px 0 20px;}
.hero-center h1 em{color:var(--green);}
.hero-center p.lead{font-size:1.14rem;color:var(--ink-soft);max-width:52ch;margin:0 auto 34px;}
.eyebrow{color:var(--green);}
.page-hero .eyebrow{color:var(--pine);}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;}
.hero-with-bg{
  background:
    linear-gradient(135deg, rgba(250,251,248,0.86) 0%, rgba(250,251,248,0.72) 100%),
    url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRabWfQg3ZvH_5aOSAuKd5fjTuByKAhrTKsE8QV1PqVpisCgjPW4ClICDk&s=10") center/cover no-repeat;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  width:100vw;
  max-width:none;
  border:0;
  border-radius:0;
  padding:88px 24px 80px;
  box-shadow:none;
}
.hero-image-panel{
  border-radius:20px;
  overflow:hidden;
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 24px;
  background:rgba(255,255,255,.14);
  margin-bottom:28px;
}
.hero-copy{text-align:center;max-width:700px;margin:0 auto;}
.hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start;}
.hero-stat-card{background:rgba(255,255,255,.95);border:1px solid rgba(21,62,27,.12);border-radius:16px;overflow:hidden;box-shadow:0 10px 24px rgba(21,62,27,.08);backdrop-filter:blur(4px);max-width:100%;margin:0 auto;width:100%;}
.hero-stat-card img{display:block;width:100%;height:120px;object-fit:cover;}
.hero-stat-card p{padding:10px 12px;color:var(--ink-soft);font-size:0.88rem;line-height:1.4;font-weight:600;}
/* spacing for hero stat card content */
.hero-stat-card img{margin-bottom:12px;}
.hero-stat-card .hero-stat-content{
  padding:18px 16px;
  color:var(--ink-soft);
  font-size:13px;
  line-height:1.6;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}

/* equalize stat card heights: make grid rows uniform and allow content to stretch */
.hero-stats{align-items:stretch;grid-auto-rows:1fr;}
.hero-stat-card{display:flex;flex-direction:column;}
.hero-stat-card .hero-stat-content{flex:1}

/* ensure headings inside stat content are centered */
.hero-stat-card .hero-stat-content h4,
.hero-stat-card .hero-stat-content h5{
  text-align:center;
  width:100%;
  margin:0.4em 0 0.25em;
}

/* make sub-headings the same size as the card body text */
.hero-stat-card .hero-stat-content h5{
  font-size:13px;
  text-decoration: underline;
  text-decoration-color: var(--pine);
  text-underline-offset: 3px;
}

/* ensure every piece of text inside the stat card is centered */
.hero-stat-card{ text-align:center; }
.hero-stat-card p{ text-align:center; margin:0.5em 0; }
.hero-stat-card .hero-stat-content p{ margin:0.4em 0; }

/* underline and highlight for specific stat headings */
.hero-stat-card .highlight-underline{
  background: #fff0a8; /* subtle yellow */
  padding:6px 10px;
  border-radius:6px;
  display:inline-block;
  font-size:1.08rem;
  line-height:1.3;
  font-weight:700;
}
.who-we-are{margin-top:28px;padding:24px 0 0;border-top:1px solid var(--line);}
.who-we-are h3{font-size:50px;margin-bottom:12px;}
.who-we-are-layout{display:flex;align-items:flex-start;gap:28px;}
.who-we-are-image{width:320px;height:auto;flex-shrink:0;display:block;object-fit:contain;order:2;}
.who-we-are p{color:var(--ink-soft);max-width:80ch;line-height:1.8;font-size:19px;margin:0;flex:1;}
@media (max-width:820px){
  .who-we-are-layout{flex-direction:column;}
  .who-we-are-image{width:min(100%,320px);order:0;} 
}
.page-hero{padding:72px 0 56px;border-bottom:1px solid var(--line);}
.page-hero h1{font-size:clamp(2.2rem,4.6vw,3.4rem);margin-top:14px;max-width:100ch;}
.page-hero h1 em{color:var(--green);}
.page-hero p{color:var(--ink-soft);max-width:62ch;margin-top:16px;font-size:1.08rem;}

/* materiality matrix */
.matrix{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;}
.matrix .mono{color:var(--ink-soft);display:block;margin-bottom:12px;}
.dot{animation:rise .9s ease both;}
.dot:nth-child(2){animation-delay:.15s}.dot:nth-child(3){animation-delay:.3s}
.dot:nth-child(4){animation-delay:.45s}.dot:nth-child(5){animation-delay:.6s}
.dot:nth-child(6){animation-delay:.75s}.dot:nth-child(7){animation-delay:.9s}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .dot{animation:none}
  html{scroll-behavior:auto}
}


.service-tabs{margin-top:44px;}
.tab-buttons{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start;margin-bottom:24px;}
.tab-button{border:1px solid var(--line);background:var(--card);color:var(--pine);padding:10px 16px;border-radius:999px;cursor:pointer;transition:background .2s,border-color .2s,color .2s;font-size:14px;}
.tab-button.active, .tab-button:focus-visible{background:var(--pine);color:var(--paper);border-color:var(--pine);}
.tab-panels{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:24px;}
.tab-panel{display:none;}
.tab-panel.active{display:block;}
.reporting-list p{margin:0 0 1rem;}
.reporting-list ul{margin:0 0 1.25rem 1.25rem;}
.reporting-list ul li{margin:0.4rem 0;}
.reporting-list p + p{margin-top:1.5rem;}
.testimonials{padding:0 0 80px;background:rgba(244,247,241,.7);}
.testimonials .section-head{margin-bottom:32px;}
.testimonial-grid{display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr));}
.testimonial-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:0 10px 30px rgba(21,62,27,.06);}
.testimonial-logo{display:block;width:180px;height:auto;margin-bottom:18px;}
.testimonial-logo--q30{width:130px;height:auto;}
.testimonial-card p{margin:0 0 1rem;color:var(--ink-soft);line-height:1.75;}
.testimonial-author{font-weight:700;color:var(--pine);margin-top:0;}
.testimonial-role{font-size:.95rem;color:var(--ink-soft);margin-top:-0.2rem;}
@media (max-width:820px){.testimonial-grid{grid-template-columns:1fr;}}
/* ---------- frameworks strip ---------- */
.frameworks{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;}
.frameworks .wrap{display:flex;gap:14px 28px;flex-wrap:wrap;align-items:center;justify-content:center;}
.frameworks .mono{color:var(--ink-soft);}

/* ---------- sections ---------- */
section{padding:80px 0;}
.section-head{max-width:60ch;margin-bottom:44px;}
.section-head .mono{font-family:'Glegoo',serif;font-size:50px;letter-spacing:normal;text-transform:uppercase;display:block;margin-bottom:12px;color:#000;}
.testimonials .section-head .mono{text-transform:none;}
.section-head h2{font-size:clamp(1.9rem,3.4vw,2.6rem);margin-top:12px;}
.founder-heading{font-family:'Glegoo',serif;font-size:50px;letter-spacing:normal;text-transform:none;display:block;margin-bottom:12px;color:var(--pine);}
.section-head p{color:var(--ink-soft);margin-top:12px;}

.services{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.service{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:28px;transition:transform .2s, box-shadow .2s;
}
.service:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(21,62,27,.08);}
.service h3{font-size:1.4rem;margin:10px 0 8px;}
.service p{color:var(--ink-soft);font-size:.97rem;}
.service .mono{color:var(--green);}
.service a.more{display:inline-block;margin-top:14px;font-size:.9rem;font-weight:600;color:var(--green);text-decoration:none;}
.service a.more:hover{text-decoration:underline;}

/* process band */
.process{background:var(--pine);color:var(--paper);}
.process .section-head h2{color:var(--paper);}
.process .section-head p{color:#B9C9BF;}
.process .eyebrow{color:var(--amber);}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.step{border:1px solid rgba(250,251,248,.22);border-radius:var(--radius);padding:26px;}
.step .mono{color:var(--amber);}
.step h3{font-size:1.35rem;margin:10px 0 8px;}
.step p{color:#B9C9BF;font-size:.95rem;}

/* about layout + stats */
.about{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;}
.about h2{font-size:clamp(1.9rem,3.4vw,2.6rem);margin-top:12px;}
.about p{color:var(--ink-soft);margin-top:14px;}
.stat-list{display:grid;gap:0;border-top:1px solid var(--line);margin-top:8px;}
.stat{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line);}
.stat b{font-family:'Glegoo',serif;font-weight:400;font-size:1.7rem;}
.stat span{color:var(--ink-soft);font-size:.92rem;}

/* value cards (about page) */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.value{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px;}
.value h3{font-size:1.3rem;margin:8px 0 8px;}
.value p{color:var(--ink-soft);font-size:.95rem;}
.value .mono{color:var(--green);}

/* CTA band */
.cta-band{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-top:48px;padding-bottom:48px;}
.cta-band h2{font-size:clamp(1.6rem,3vw,2.2rem);max-width:28ch;}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
form{display:grid;gap:14px;}
label{font-size:.88rem;font-weight:600;}
input,textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:8px;
  background:var(--card);font:inherit;color:var(--pine);
}
input:focus,textarea:focus{outline:2px solid var(--green);outline-offset:1px;border-color:var(--green);}
form .btn{justify-self:start;}

footer{border-top:1px solid var(--line);padding:32px 0;}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--ink-soft);font-size:.9rem;}
footer nav{display:flex;gap:18px;}
footer nav a{font-size:.88rem;color:var(--ink-soft);text-decoration:none;}
footer nav a:hover{color:var(--pine);} 
.footer-contact{margin-top:6px;padding-top:0;border-top:0;display:block;text-align:left;}
.footer-heading-row{display:flex;align-items:center;gap:10px;margin-bottom:6px;}
.footer-contact h3{font-size:1.2rem;margin:0;text-align:left;}
.footer-contact p{margin:2px 0;color:var(--ink-soft);text-align:left;}
.linkedin-link{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;overflow:hidden;padding:0;background:transparent;border:0;transition:transform .2s;}
.linkedin-link:hover{transform:translateY(-1px);}
.linkedin-link img{width:100%;height:100%;object-fit:contain;display:block;filter:none;}

/* ---------- mobile ---------- */
@media (max-width:820px){
  .masthead img{height:84px;}
  .tabs ul{gap:20px;}
  .hero-center{padding:60px 0 52px;}
  .hero-stats{grid-template-columns:1fr;}
  .hero-copy{text-align:center;}
  .hero-copy .hero-cta{justify-content:center;}
  .services,.steps,.about,.contact-grid,.values{grid-template-columns:1fr;}
  section{padding:56px 0;}
}
