/* Editorial surfaces: one palette and spacing system, shared across PT and EN. */
:root {
  --surface-blue: #e5edfb;
  --surface-navy: #101f36;
  --surface-space: clamp(48px, 6vw, 88px);
  --image-radius: 24px;
}
body { overflow-x: clip; }
.about-section, .testimonials-section, .contact-panel,
.case-hero, .strategic-decisions, .strategic-influence, .next-section {
  position: relative;
  isolation: isolate;
}
.about-section::before, .testimonials-section::before, .contact-panel::before,
.case-hero::before, .strategic-decisions::before, .strategic-influence::before, .next-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--band-color);
  box-shadow: 0 0 0 100vmax var(--band-color);
  clip-path: inset(0 -100vmax);
  z-index: -1;
  pointer-events: none;
}
/* Home: preserve the editorial opening and add rhythm below the work. */
.about-section {
  --band-color: var(--surface-blue);
  border: 0;
  padding-block: var(--surface-space);
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 28px;
  align-items: start;
}
.about-portrait { grid-column: 1/6; grid-row: 1/3; aspect-ratio: 4/5; margin: 0; }
.about-copy, .about-facts { grid-column: 7/13; }
.about-copy h2 { font-size: clamp(36px, 4.2vw, 60px); max-width: 13ch; }
.about-copy > p { max-width: 49ch; }
.about-copy .text-link { margin-top: 16px; }
.about-facts { padding: 24px 0 0; border-top: 1px solid #b9c7de; }
.about-facts .stats { margin-bottom: 24px; }
.about-facts .pills { margin-top: 12px; }
.experience-section { border: 0; padding-block: var(--surface-space); }
.experience-item { padding-block: 28px; }
.testimonials-section {
  --band-color: var(--surface-navy);
  --line: #43536c;
  --muted: #c5d0e1;
  color: #fff;
  border: 0;
  padding-block: var(--surface-space);
}
.testimonials-section .section-header { margin-bottom: 36px; }
.testimonials-section .section-header h2 { max-width: 24ch; font-size: clamp(34px, 3.6vw, 52px); }
.testimonials-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
.testimonials-grid .testimonial-card:nth-child(n) { grid-column: auto; padding: 24px 0 0; }
.testimonial-mark { color: #a6bcff; }
.testimonial-card blockquote { margin: 12px 0 28px; }
.testimonial-card blockquote p { color: #fff; font-size: clamp(21px, 1.8vw, 26px); line-height: 1.5; font-style: italic; }
.testimonial-card figcaption { border-color: var(--line); padding-top: 20px; }
.testimonials-section .text-link { border-color: #8c9db5; }
.testimonials-section a:focus-visible { outline-color: #c5d6ff; }
.contact-panel {
  --band-color: var(--surface-blue);
  background: transparent;
  color: var(--ink);
  border-radius: 0;
  padding: var(--surface-space) 0;
  margin: 0;
  gap: 48px;
}
.contact-panel > div { max-width: 800px; }
.contact-panel h2 { font-size: clamp(40px, 5vw, 72px); max-width: 17ch; }
.contact-panel p { color: #40506a; max-width: 52ch; }
.contact-panel .button { background: var(--blue); color: #fff; border-color: var(--blue); min-height: 52px; }
.contact-panel .button:hover { background: var(--ink); border-color: var(--ink); }
.contact-panel a:focus-visible { outline-color: var(--blue); }
/* Cases: project palettes, compact opening, and varied editorial layouts. */
.case-page { --case-dark: #101f36; --case-soft: #e5edfb; --case-light: #d5e3ff; }
.case-page[data-project="itau"] { --case-dark: #001e4f; --case-soft: #e9eef6; --case-light: #d0dff9; }
.case-page[data-project="bia"] { --case-dark: #650e2b; --case-soft: #fce8ee; --case-light: #ffd9e5; }
.case-page[data-project="porto-bank"] { --case-dark: #00316b; --case-soft: #e7f1ff; --case-light: #d2e5ff; }
.case-page[data-project="nome-social"] { --case-dark: #00445f; --case-soft: #e3f5ff; --case-light: #d0efff; }
.case-page > .back-link { margin: 24px 0; min-height: 44px; display: inline-flex; align-items: center; }
.case-page .case-hero {
  --band-color: var(--case-dark);
  --line: #ffffff45;
  --muted: var(--case-light);
  color: #fff;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 36px 24px;
  padding: 48px 0;
  align-items: center;
}
.case-page .case-intro { grid-column: 1/9; padding: 0; }
.case-page .case-intro > .eyebrow { color: var(--case-light); }
.case-page .case-intro h1 { font-size: clamp(44px, 5.2vw, 76px); line-height: 1.03; max-width: 23ch; }
.case-page .case-intro > p { color: var(--case-light); font-size: 18px; max-width: 60ch; line-height: 1.65; margin-top: 22px; }
.case-page .case-meta { grid-template-columns: 1fr 1.25fr .7fr; gap: 20px; margin-top: 28px; }
.case-page .case-meta dt { color: var(--case-light); font-size: 12px; }
.case-page .case-meta dd { font-size: 14px; }
.case-page .case-meta > div:last-child { grid-column: auto; display: block; }
.case-page .case-hero-image { grid-column: 9/13; width: 100%; aspect-ratio: 4/5; margin: 0; border-radius: var(--image-radius); }
.case-page .case-hero-image img { object-position: center 20%; }
.case-page[data-project="bia"] .case-hero-image img,
.case-page[data-project="nome-social"] .case-hero-image img { object-position: 65% top; }
.case-page .case-summary { margin: 0; padding: 40px 0; gap: 32px; border-top: 0; }
.case-page .case-summary > article { border-top: 0; padding: 0; }
.case-page .case-summary > article + article { border-left: 1px solid var(--line); padding-left: 28px; }
.case-page .case-summary h3 { font-size: 23px; }
.case-page .case-summary p { font-size: 15px; }
.case-page .case-row { padding-block: var(--surface-space); gap: 40px; }
.case-page .section-intro h2 { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; max-width: 22ch; }
.case-page .section-intro > p { font-size: 16px; line-height: 1.8; max-width: 65ch; }
.case-page .section-intro > p + p { margin-top: 20px; }
.case-page .flow-panel { background: var(--case-soft); border-radius: 24px; padding: 32px; }
.case-page .strategic-decisions {
  --band-color: var(--case-soft);
  display: block;
  border: 0;
}
.case-page .strategic-decisions > .section-intro { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0 32px; margin-bottom: 36px; }
.strategic-decisions > .section-intro > .eyebrow { grid-column: 1/-1; margin-bottom: 16px; }
.case-page .strategic-decisions > .section-intro > h2 { grid-column: 1/6; grid-row: 2/4; }
.case-page .strategic-decisions > .section-intro > p { grid-column: 7/13; margin-top: 0; }
.case-page .strategic-decisions > .section-intro > p + p { margin-top: 20px; }
.case-page .strategic-decisions .decision-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.case-page .decision-card { padding: 24px 0 0; }
.case-page .decision-card h3 { font-size: 24px; }
.case-page .decision-card p { font-size: 15px; line-height: 1.75; }
.case-page .strategic-influence {
  --band-color: var(--case-dark);
  --muted: var(--case-light);
  --line: #ffffff45;
  color: #fff;
  border: 0;
  align-items: center;
}
.strategic-influence .eyebrow { color: var(--case-light); }
.case-page .strategic-influence > .section-intro + .section-intro { border-left: 1px solid var(--line); padding-left: 40px; }
.case-page .strategic-influence p { color: var(--case-light); margin: 0; }
.case-page[data-project="itau"] .evidence-list { padding: 0; background: none; border-radius: 0; border-top: 1px solid var(--line); }
.case-page .evidence-list h3 { font-size: 24px; line-height: 1.2; }
.case-page .evidence-list p { font-size: 16px; }
.case-page .examples-row { display: block; }
.case-page .examples-row > .section-intro { margin-bottom: 36px; }
.case-page .examples-gallery { gap: 32px; }
.case-page .examples-gallery .example-screen { background: var(--case-soft); }
.case-page .results-row { display: block; }
.case-page .results-row > .section-intro { margin-bottom: 32px; }
.case-page .results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.case-page .results-grid > article { padding: 24px 0; background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; }
.case-page[data-project="porto-bank"] .results-grid > article:first-child { background: var(--case-soft); border-top: 0; padding: 28px; border-radius: 24px; }
.case-page .results-grid h3 { font-size: clamp(25px, 2.5vw, 34px); line-height: 1.16; }
.case-page .results-grid p { font-size: 16px; max-width: 56ch; }
.case-page .case-editorial-note { margin-block: 32px; }
.case-page .source-reference { margin-block: 28px 40px; }
.case-page .next-section { --band-color: var(--case-soft); margin-top: 32px; padding-block: var(--surface-space); grid-template-columns: 1fr 1.5fr; gap: 48px; }
.case-page .next-section .project-card-image { display: grid; grid-template-columns: .85fr 1.15fr; gap: 28px; align-items: center; }
.case-page .next-section .project-card-image .project-visual { aspect-ratio: 4/5; border-radius: 24px; }
.case-page .next-section .project-card-image .project-cover { object-position: center top; }
.case-page .next-section .project-card-image .project-text { padding: 0 44px 0 0; }
.case-page .next-section .project-card-image h3 { font-size: clamp(25px, 2.5vw, 36px); }
.case-page .next-section .project-card-image .project-support { font-size: 15px; }
.case-page .next-section .round-arrow { top: 0; }
/* Full-width sections retain comfortable lines and touch targets on smaller screens. */
@media (max-width: 1000px) {
  .about-portrait { grid-column: 1/6; aspect-ratio: 3/4; }
  .about-copy, .about-facts { grid-column: 7/13; }
  .testimonials-grid { gap: 24px; }
  .case-page .case-intro { grid-column: 1/8; }
  .case-page .case-hero-image { grid-column: 8/13; }
  .case-page .case-intro h1 { font-size: 50px; }
  .case-page .case-meta { grid-template-columns: 1fr 1fr; }
  .case-page .case-meta > div:last-child { grid-column: 1/-1; }
  .case-page .case-meta > div:nth-child(2) { border: 0; }
  .case-page .next-section { grid-template-columns: 1fr; gap: 28px; }
  .case-page .next-section .project-card-image { grid-template-columns: 1fr 1.5fr; }
  .case-page .next-section .project-card-image .project-visual { aspect-ratio: 3/2; }
}
@media (max-width: 900px) {
  .testimonials-grid { grid-template-columns: 1fr; }
  .testimonials-grid .testimonial-card:nth-child(n) { grid-column: 1; }
  .testimonial-card blockquote p { font-size: 24px; max-width: 44ch; }
  .testimonials-grid .testimonial-card { padding-top: 28px; }
  .case-page .strategic-decisions > .section-intro { display: block; }
  .case-page .strategic-decisions > .section-intro > p { margin-top: 24px; }
  .case-page .strategic-decisions .decision-grid { grid-template-columns: 1fr; gap: 24px; }
  .case-page .strategic-influence > .section-intro + .section-intro { padding-left: 0; border: 0; }
  .case-page .case-summary { gap: 24px; }
  .case-page .case-summary > article { display: block; }
  .case-page .case-summary > article + article { padding-left: 20px; }
  .case-page .case-summary .icon-tile { margin-bottom: 16px; }
}
@media (max-width: 640px) {
  .about-section { display: flex; gap: 28px; }
  .about-portrait { width: 100%; aspect-ratio: 4/3; }
  .about-portrait img { object-position: center top; }
  .about-copy h2 { font-size: 38px; }
  .about-facts { padding-top: 28px; }
  .testimonials-section .section-header h2 { font-size: 36px; }
  .testimonial-card blockquote p { font-size: 23px; }
  .contact-panel { gap: 28px; }
  .contact-panel h2 { font-size: 42px; }
  .contact-panel .button { white-space: normal; }
  .case-page > .back-link { margin: 12px 0; }
  .case-page .case-hero { display: flex; flex-direction: column; align-items: stretch; padding: 32px 0; gap: 28px; }
  .case-page .case-intro h1 { font-size: clamp(38px, 10.3vw, 58px); letter-spacing: -.045em; }
  .case-page .case-intro > p { font-size: 16px; margin-top: 20px; }
  .case-page .case-hero-image { aspect-ratio: 3/2; }
  .case-page .case-meta { gap: 20px; }
  .case-page .case-meta dd { font-size: 13px; }
  .case-page .case-summary { grid-template-columns: 1fr; padding: 32px 0; gap: 24px; }
  .case-page .case-summary > article { display: flex; }
  .case-page .case-summary > article + article { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .case-page .case-summary .icon-tile { margin: 0; }
  .case-page .case-row { gap: 28px; }
  .case-page .section-intro h2 { font-size: 34px; }
  .case-page .flow-panel { padding: 24px; }
  .case-page .results-grid { grid-template-columns: 1fr; gap: 16px; }
  .case-page .next-section .project-card-image { display: flex; gap: 20px; }
  .case-page .next-section .project-card-image .project-visual { width: 100%; aspect-ratio: 1.8; }
  .case-page .next-section .project-card-image .project-text { padding: 0 44px 0 0; }
  .case-page .next-section .project-card-image h3 { font-size: 29px; }
}
@media (prefers-reduced-motion: reduce) {
  .project-card .project-cover { transition: none; transform: none !important; }
}

/* Deliberate section alternation: soft, white, then the project emphasis. */
.case-page .case-summary,
.case-page .problem-row,
.case-page .work-row,
.case-page .evidence-row,
.case-page .examples-row,
.case-page .results-row {
  position: relative;
  isolation: isolate;
  border-bottom: 0;
}
.case-page .case-summary::before,
.case-page .problem-row::before,
.case-page .work-row::before,
.case-page .evidence-row::before,
.case-page .examples-row::before,
.case-page .results-row::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--band-color);
  box-shadow: 0 0 0 100vmax var(--band-color);
  clip-path: inset(0 -100vmax);
  z-index: -1;
  pointer-events: none;
}
.case-page .case-summary,
.case-page .work-row,
.case-page .evidence-row,
.case-page .results-row { --band-color: #fff; }
.case-page .problem-row,
.case-page .examples-row { --band-color: var(--case-soft); }
.case-page .problem-row .flow-panel,
.case-page .examples-gallery .example-screen { background: #fff; }
.case-page .case-summary { margin-bottom: 0; }
.case-page .next-section { --band-color: #fff; margin-top: 0; }
/* Contact is a portfolio component; its colors do not inherit project themes. */
.contact-panel {
  --band-color: #e5edfb;
  --ink: #101c30;
  --blue: #2647ef;
  color: #101c30;
}
.contact-panel .button { background: #2647ef; border-color: #2647ef; color: #fff; }
.contact-panel .button:hover { background: #101c30; border-color: #101c30; }
.contact-panel .button:active { background: #172c9e; border-color: #172c9e; }
.contact-panel a:focus-visible { outline-color: #2647ef; }

/* Direct contact: shared by the home and every case, in both languages. */
.contact-panel>.contact-actions{flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:460px}
.contact-actions .button{justify-content:center;white-space:nowrap}
.button.button-secondary{background:transparent;color:#101c30;border:1px solid #8998b1}
.button.button-secondary:hover{background:#d2def4;color:#101c30;border-color:#101c30}
.button.button-secondary:active{background:#bfceec;color:#101c30}




.contact-panel:has(.contact-actions){gap:40px}
.contact-panel:has(.contact-actions) h2{font-size:clamp(40px,4.5vw,64px)}
.contact-panel:has(.contact-actions)>div:first-child{max-width:700px}
/* Constant travel speed, independent of the width of the repeating group. */
.company-band .clients-band{grid-template-columns:minmax(0,1fr);gap:0}
.logo-marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.logo-track{display:flex;width:max-content;animation:client-logos-travel var(--logo-duration,30s) linear infinite;will-change:transform}
.logo-group,.logo-group[aria-hidden=true]{display:flex;flex-wrap:nowrap;flex:none;width:max-content;min-width:100vw;justify-content:space-around;align-items:center;gap:42px;padding:0 42px 0 0}
.logo-group .client-logo{width:148px;min-width:148px;flex:0 0 148px}

.logo-marquee:hover .logo-track{animation-play-state:running}

@keyframes client-logos-travel{to{transform:translateX(-50%)}}
@media(max-width:1100px){
 .contact-panel:has(.contact-actions){flex-direction:column;align-items:start}
 .contact-panel>.contact-actions{width:100%;max-width:460px}
}
@media(max-width:640px){
 .contact-panel>.contact-actions{grid-template-columns:1fr;gap:12px}
 .contact-actions .button{width:100%;justify-content:space-between}
 
 .company-band .clients-band{gap:8px}
 .logo-group,.logo-group[aria-hidden=true]{gap:32px;padding-right:32px}
 .logo-group .client-logo{width:112px;min-width:112px;flex-basis:112px}
 
}
@media(prefers-reduced-motion:reduce){
 .logo-track{animation:none;transform:none;width:100%;will-change:auto}
 .logo-group{flex-wrap:wrap;width:100%;min-width:0;gap:16px;padding:0;justify-content:center}
 .logo-group[aria-hidden=true]{display:none}
 .logo-group .client-logo{min-width:0;flex:0 0 calc(33.333% - 16px)}
 .logo-marquee{mask-image:none;-webkit-mask-image:none}
 .company-band .clients-band{grid-template-columns:minmax(0,1fr)}
 
}

/* Centered, first-person introduction with the existing editorial typography. */
.home-hero{padding:64px 0 44px}
.home-hero .hero-copy{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;padding:0}
.home-hero .direction-label{width:100%;text-align:center}
.home-hero h1{width:100%;max-width:1120px;margin:0 auto 32px;font-size:clamp(48px,6.6vw,96px);line-height:1.04;letter-spacing:-.055em;text-wrap:balance}
.home-hero .hero-actions{justify-content:center;flex-wrap:wrap;gap:16px;margin-top:0}
.home-hero .resume-links{justify-content:center;text-align:center;margin-top:16px}
.company-band,.company-band .clients-band{border:0}
@media(max-width:640px){
 .home-hero{padding:44px 0 28px}
 .home-hero h1{font-size:clamp(40px,10.6vw,64px);line-height:1.08;margin-bottom:28px}
 .home-hero h1 br{display:none}
 .home-hero .hero-actions{gap:12px}
 .home-hero .hero-actions .button{font-size:14px;min-height:52px;padding-inline:20px;gap:16px}
 .home-hero .resume-links{margin-top:16px}
}

/* Two deliberate title lines on larger screens; natural wrapping on phones. */
.home-hero h1{max-width:1200px;font-size:clamp(38px,6vw,88px)}
.home-hero .hero-line{display:block;white-space:nowrap}
.company-band .clients-band{grid-template-columns:minmax(0,1fr);gap:0}
@media(max-width:640px){
 .home-hero h1{font-size:clamp(40px,10.6vw,64px)}
 .home-hero .hero-line{display:inline;white-space:normal}
}

/* Use the former action columns for the experience description. */
@media(min-width:641px){.experience-section .experience-item p{grid-column:6/-1;max-width:52ch}}

/* Recommendation link: keep the label and arrow without an underline. */
.testimonials-source .text-link{border-bottom:0;text-decoration:none}
