:root{--navy:#24324A;--teal:#3A7677;--orange:#DD7438;--paper:#F4F0E9;--ink:#20262B;--muted:#687176;--line:rgba(32,38,43,.18);--display:'Barlow Condensed',sans-serif;--sans:'Barlow',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.48 var(--sans)}.wrap{width:min(1240px,calc(100% - 56px));margin:auto}.micro{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}a{color:inherit}.hero{background:var(--navy);color:white;padding:86px 0}.hero-grid,.split{display:grid;grid-template-columns:.65fr 1.35fr;gap:76px}.hero h1,.title{font:700 clamp(58px,8vw,116px)/.8 var(--display);text-transform:uppercase;letter-spacing:-.04em;margin:8px 0}.hero h1 em{display:block;color:var(--orange);font-style:italic}.hero p{font-size:23px;color:#dce2e7;max-width:760px}.hero-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.hero-nav a,.download{border:1px solid #748096;padding:9px 12px;text-decoration:none;font-size:13px}.hero-nav a:hover{background:white;color:var(--navy)}section{padding:88px 0}.results{background:white;padding:38px 0}.numbers{display:grid;grid-template-columns:repeat(5,1fr)}.number{padding:8px 24px;border-left:1px solid var(--line)}.number:first-child{border:0;padding-left:0}.number strong{display:block;font:700 50px/1 var(--display);color:var(--teal)}.number span{font-size:13px;color:var(--muted)}.intro p{font-size:22px;max-width:800px;margin-top:0}.section-head{display:grid;grid-template-columns:minmax(330px,.82fr) minmax(420px,1.18fr);gap:64px;margin-bottom:45px}.section-head h2{font:700 clamp(45px,5.25vw,72px)/.88 var(--display);text-transform:uppercase;margin:0;max-width:9.5em}.section-head p{font-size:20px;color:var(--muted);margin:0}.journey,.archive.white{background:white}.job{display:grid;grid-template-columns:165px 1fr;gap:35px;padding:32px 0;border-top:1px solid var(--line)}.job:last-child{border-bottom:1px solid var(--line)}.date{font:600 19px var(--display);color:var(--orange)}.job h3{font:700 39px/.95 var(--display);text-transform:uppercase;color:var(--navy);margin:0}.company{font-weight:700;color:var(--teal);margin:4px 0 13px}.job p{max-width:830px;color:#535d62}details{margin-top:16px;border-top:1px dashed #aab0b3}summary{cursor:pointer;display:flex;justify-content:space-between;padding:12px 0;font-weight:700;color:var(--teal);list-style:none}summary::-webkit-details-marker{display:none}summary b{font-size:22px;transition:transform .25s}details[open] summary b{transform:rotate(45deg)}.detail-body{overflow:hidden}.detail-body ul{margin:2px 0 12px;padding-left:20px}.detail-body li{margin:7px 0}.archive{background:var(--paper)}.archive.teal{background:var(--teal);color:white}.archive.teal .micro,.archive.teal .archive-row span{color:#fff}.archive.teal .section-head p,.archive.teal .archive-row em{color:#dce9e8}.archive.teal .archive-row{border-color:rgba(255,255,255,.3)}.archive details{border-top:0}.archive details>summary{font:700 23px var(--display);text-transform:uppercase;border-bottom:1px solid var(--line);color:var(--orange)}.archive-row{display:grid;grid-template-columns:90px .7fr 1.3fr;gap:25px;padding:14px 0;border-bottom:1px solid var(--line)}.archive-row span{font-weight:700;color:var(--orange)}.archive-row strong small{display:block;font:500 12px var(--sans);color:var(--teal);margin-top:3px}.archive-row em{font-style:normal;color:var(--muted)}.books{display:grid;grid-template-columns:1fr 1fr;gap:25px}.book{border-top:3px solid var(--orange);padding-top:14px}.book h3{font:700 31px/1 var(--display);text-transform:uppercase;margin:4px 0 10px}.skills{background:var(--navy);color:white}.skill{display:grid;grid-template-columns:.55fr 1.45fr;gap:45px;padding:19px 0;border-top:1px solid #647087}.skill h3{font:700 25px var(--display);text-transform:uppercase;color:var(--orange);margin:0}.skill p{margin:0;color:#dbe1e6}.personal{background:var(--orange);color:white}.values{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}.value{border-top:1px solid white;padding-top:10px}.value h3{font:700 27px var(--display);text-transform:uppercase;margin:0}.assessment{margin-top:35px;max-width:850px}.contact{background:var(--teal);color:white}.contact a{display:inline-block;margin:8px 12px 0 0;border:1px solid white;padding:10px 14px;text-decoration:none}
@media(prefers-reduced-motion:no-preference){.reveal{opacity:0;transform:translateY(20px);transition:.65s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}.job{transition:.25s}.job:hover{padding-left:10px;padding-right:10px;background:rgba(58,118,119,.05)}details .detail-body{animation:open .28s ease}@keyframes open{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}}
@media(max-width:850px){.wrap{width:calc(100% - 34px)}.hero-grid,.split,.section-head{grid-template-columns:1fr;gap:28px}.numbers{grid-template-columns:1fr 1fr}.number{border:0;border-top:1px solid var(--line);padding:12px 0}.job{grid-template-columns:1fr;gap:7px}.archive-row{grid-template-columns:70px 1fr}.archive-row em{grid-column:2}.books,.values{grid-template-columns:1fr 1fr}.skill{grid-template-columns:1fr;gap:7px}}
@media(max-width:520px){section{padding:62px 0}.books,.values{grid-template-columns:1fr}.archive-row{grid-template-columns:1fr;gap:4px}.archive-row em{grid-column:1}}

.featured-list{margin:8px 0 24px}.education-visible{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:34px}.edu-card{border-top:3px solid var(--teal);padding-top:14px}.edu-card h3{font:700 29px/1 var(--display);text-transform:uppercase;color:var(--navy);margin:5px 0 12px}.edu-card p{color:#596166}.edu-card strong{color:var(--ink)}
@media(max-width:850px){.education-visible{grid-template-columns:1fr}}

.archive.teal details>summary{color:#fff;border-color:rgba(255,255,255,.42)}.archive.teal .archive-row strong{color:#fff}.archive.teal .archive-row strong small{color:#d9eceb}.contact .micro{color:#fff!important}
.kindness{margin:52px 0 8px;padding:28px 0;border-top:1px solid rgba(255,255,255,.65);border-bottom:1px solid rgba(255,255,255,.65);font:700 clamp(42px,6vw,78px)/.9 var(--display);text-transform:uppercase;letter-spacing:-.025em;max-width:1050px}
.psych-intro{max-width:850px;margin-top:28px;color:#fff}.psych-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:24px 0}.psych-item{border-top:1px solid rgba(255,255,255,.65);padding-top:10px}.psych-item strong{display:block;font:700 35px/1 var(--display)}.psych-item span{font-size:14px}
@media(prefers-reduced-motion:no-preference){.hero h1{animation:heroIn .85s cubic-bezier(.2,.7,.2,1) both}.hero h1 em{display:block;animation:heroAccent .95s .16s cubic-bezier(.2,.7,.2,1) both}.hero-grid>div:last-child{animation:heroCopy .75s .24s both}.archive-row{transition:transform .22s ease,padding-left .22s ease}.archive-row:hover{transform:translateX(5px);padding-left:7px}.skill h3,.edu-card h3,.book h3{transition:transform .22s ease}.skill:hover h3,.edu-card:hover h3,.book:hover h3{transform:translateX(5px)}.value{transition:transform .28s ease}.value:hover{transform:translateY(-5px)}@keyframes heroIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes heroAccent{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}@keyframes heroCopy{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}}
@media(max-width:850px){.psych-grid{grid-template-columns:1fr 1fr}}


/* =========================================================
   ABOUT PAGE — VISUAL REFINEMENT V5
   Scoped to .piero-about: homepage remains unchanged.
   ========================================================= */

/* Section intros: give headings more room and improve balance */
.piero-about .section-head{
  grid-template-columns:minmax(400px,.95fr) minmax(390px,1.05fr)!important;
  gap:54px!important;
  align-items:start;
}
.piero-about .section-head h2{
  max-width:10.5em!important;
  font-size:clamp(48px,5.15vw,72px)!important;
}
.piero-about .section-head p{
  font-size:21px!important;
  line-height:1.52!important;
  max-width:700px;
}

/* Hero: stronger identity, more readable supporting copy */
.piero-about .hero{padding-top:100px!important;padding-bottom:100px!important}
.piero-about .hero h1{font-size:clamp(66px,8.6vw,126px)!important}
.piero-about .hero p{
  font-size:24px!important;
  line-height:1.48!important;
  max-width:800px!important;
}

/* Intro / short version */
.piero-about .intro p{
  font-size:23px!important;
  line-height:1.55!important;
}

/* Professional journey: more breathing room and readable second level */
.piero-about .job{
  padding-top:40px!important;
  padding-bottom:40px!important;
  grid-template-columns:175px 1fr!important;
  gap:42px!important;
}
.piero-about .job h3{
  font-size:42px!important;
  line-height:.98!important;
}
.piero-about .job .company{
  font-size:17px!important;
  margin-top:7px!important;
  margin-bottom:16px!important;
}
.piero-about .job p{
  font-size:18px!important;
  line-height:1.58!important;
  max-width:900px!important;
}
.piero-about .job summary{
  padding-top:15px!important;
  padding-bottom:15px!important;
}

/* Archive rows: metadata stays compact, content becomes readable */
.piero-about .archive-row{
  grid-template-columns:105px .72fr 1.28fr!important;
  gap:30px!important;
  padding-top:17px!important;
  padding-bottom:17px!important;
}
.piero-about .archive-row strong{
  font-size:16px!important;
  line-height:1.35!important;
}
.piero-about .archive-row em{
  font-size:15px!important;
  line-height:1.48!important;
}
.piero-about .archive details>summary{
  font-size:25px!important;
  padding-top:16px!important;
  padding-bottom:16px!important;
}

/* Teaching: preserve the successful teal/white treatment */
.piero-about #teaching .archive-row,
.piero-about #teaching .archive-row strong,
.piero-about #teaching .archive-row em{
  color:#F4F0E9!important;
}

/* Books deserve more visual authority */
.piero-about .books{gap:38px!important;margin-top:12px!important;margin-bottom:28px!important}
.piero-about .book{padding-top:18px!important}
.piero-about .book h3{
  font-size:37px!important;
  line-height:1.02!important;
  max-width:14em;
}
.piero-about .book p{
  font-size:17px!important;
  line-height:1.55!important;
  max-width:620px;
}

/* Certifications: credibility information should not look like fine print */
.piero-about #certifications .featured-list{
  margin-top:18px!important;
  margin-bottom:34px!important;
}
.piero-about #certifications .featured-list .archive-row{
  padding-top:20px!important;
  padding-bottom:20px!important;
}
.piero-about #certifications .featured-list .archive-row strong{
  font-family:var(--display)!important;
  font-size:24px!important;
  line-height:1!important;
  text-transform:uppercase;
  color:var(--navy)!important;
}
.piero-about #certifications .featured-list .archive-row em{
  font-size:16px!important;
}

/* Academic education: retain detail, make it pleasant to read */
.piero-about .education-visible{
  gap:40px!important;
  margin-top:42px!important;
}
.piero-about .edu-card{
  padding-top:18px!important;
}
.piero-about .edu-card h3{
  font-size:34px!important;
  line-height:1.03!important;
  margin-bottom:17px!important;
}
.piero-about .edu-card p{
  font-size:17px!important;
  line-height:1.62!important;
  margin-top:10px!important;
  margin-bottom:14px!important;
}

/* Skills / knowledge map: slightly increase legibility without losing density */
.piero-about .skill{
  padding-top:23px!important;
  padding-bottom:23px!important;
}
.piero-about .skill h3{font-size:27px!important}
.piero-about .skill p{
  font-size:17px!important;
  line-height:1.52!important;
}

/* Personal section: values become prelude; the statement is the climax */
.piero-about .personal{
  padding-top:96px!important;
  padding-bottom:110px!important;
}
.piero-about .personal .values{
  margin-top:8px!important;
  margin-bottom:58px!important;
}
.piero-about .personal .value h3{font-size:29px!important}
.piero-about .personal .value p{
  font-size:16px!important;
  line-height:1.5!important;
}
.piero-about .kindness{
  max-width:1180px!important;
  margin-top:72px!important;
  margin-bottom:38px!important;
  padding-top:36px!important;
  padding-bottom:38px!important;
  font-size:clamp(58px,7.3vw,104px)!important;
  line-height:.86!important;
  letter-spacing:-.035em!important;
}
.piero-about .psych-intro{
  font-size:18px!important;
  line-height:1.55!important;
  max-width:900px!important;
}

/* Assessment: hierarchy instead of eight equally loud KPI cards */
.piero-about .psych-grid{
  grid-template-columns:repeat(4,1fr)!important;
  gap:22px!important;
  margin-top:34px!important;
  margin-bottom:30px!important;
}
.piero-about .psych-item{
  padding-top:13px!important;
  opacity:.72;
}
.piero-about .psych-item strong{
  font-size:29px!important;
}
.piero-about .psych-item span{
  font-size:13px!important;
  line-height:1.35!important;
}
.piero-about .psych-item:nth-child(1),
.piero-about .psych-item:nth-child(2){
  opacity:1;
}
.piero-about .psych-item:nth-child(1) strong,
.piero-about .psych-item:nth-child(2) strong{
  font-size:45px!important;
}

/* Closing machine-readable block: make it feel like a conclusion, not a footer */
.piero-about .contact{
  padding-top:105px!important;
  padding-bottom:105px!important;
}
.piero-about .contact p{
  font-size:19px!important;
  line-height:1.55!important;
  max-width:720px;
}
.piero-about .contact .download{
  margin-top:16px!important;
  padding:12px 15px!important;
}

/* Responsive refinements */
@media(max-width:980px){
  .piero-about .section-head{grid-template-columns:1fr!important;gap:25px!important}
  .piero-about .section-head h2{max-width:12em!important}
  .piero-about .job{grid-template-columns:145px 1fr!important;gap:28px!important}
  .piero-about .archive-row{grid-template-columns:90px .8fr 1.2fr!important;gap:20px!important}
}
@media(max-width:700px){
  .piero-about .hero{padding-top:72px!important;padding-bottom:72px!important}
  .piero-about .hero p{font-size:20px!important}
  .piero-about .job{grid-template-columns:1fr!important;gap:8px!important;padding-top:32px!important;padding-bottom:32px!important}
  .piero-about .job h3{font-size:36px!important}
  .piero-about .archive-row{grid-template-columns:1fr!important;gap:5px!important}
  .piero-about .archive-row em{grid-column:1!important}
  .piero-about .education-visible{grid-template-columns:1fr!important;gap:30px!important}
  .piero-about .psych-grid{grid-template-columns:1fr 1fr!important}
  .piero-about .kindness{font-size:clamp(48px,13vw,74px)!important;margin-top:52px!important}
  .piero-about .personal{padding-top:72px!important;padding-bottom:80px!important}
  .piero-about .contact{padding-top:78px!important;padding-bottom:78px!important}
}