/* ============================================================
   I FEEL Desenvolvimento Humano — Design System
   Palette and type are the client's own brand guide:
   Petrol #0D2B2E / Petrol2 #3C8386 / Dourado #C7A86A /
   Sálvia #86A69A / Creme #F2EDE4 / Quase-preto #1A1E1F.
   Titles set in Cambria (the brand's serif), body in Calibri.
   Dourado is an accent only — never a dominant fill, per brand rule.
   ============================================================ */

:root{
  /* --- brand constants (same in both themes) --- */
  --petrol:      #0D2B2E;
  --petrol-2:    #3C8386;
  --petrol-3:    #5FA3A0;
  --dourado:     #C7A86A;
  --dourado-2:   #DEC08A;
  --salvia:      #86A69A;
  --creme:       #F2EDE4;
  --quase-preto: #1A1E1F;

  --display: Cambria, 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --body: Calibri, 'Segoe UI', 'Helvetica Neue', Roboto, Arial, sans-serif;

  --wrap: 1220px;
  --pad: clamp(20px, 5vw, 64px);
  --ease: cubic-bezier(.22,.61,.36,1);
  --radius-pill: 100px;
  --radius-card: 20px;

  color-scheme: light;

  /* --- light theme (default) --- */
  --bg:          var(--creme);
  --bg-alt:      #E9E0CE;
  --surface:     #FBF8F1;
  --ink:         var(--quase-preto);
  --ink-soft:    #454E49;
  --line:        rgba(26,30,31,0.13);
  --eyebrow:     #96762F;
  --shadow-btn:  0 10px 28px -8px rgba(13,43,46,0.32);
  --shadow-card: 0 18px 44px -24px rgba(13,43,46,0.28);
  --glyph-opacity: 0.06;
}

:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:          var(--quase-preto);
  --bg-alt:      #10201F;
  --surface:     #14302E;
  --ink:         var(--creme);
  --ink-soft:    #C2C9C1;
  --line:        rgba(242,237,228,0.14);
  --eyebrow:     var(--dourado-2);
  --shadow-btn:  0 0 0 1px rgba(199,168,106,0.18), 0 0 30px rgba(199,168,106,0.34);
  --shadow-card: 0 0 60px -18px rgba(60,131,134,0.45);
  --glyph-opacity: 0.09;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --bg:          var(--quase-preto);
    --bg-alt:      #10201F;
    --surface:     #14302E;
    --ink:         var(--creme);
    --ink-soft:    #C2C9C1;
    --line:        rgba(242,237,228,0.14);
    --eyebrow:     var(--dourado-2);
    --shadow-btn:  0 0 0 1px rgba(199,168,106,0.18), 0 0 30px rgba(199,168,106,0.34);
    --shadow-card: 0 0 60px -18px rgba(60,131,134,0.45);
    --glyph-opacity: 0.09;
  }
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  transition: background .4s var(--ease), color .4s var(--ease);
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

::selection{ background:var(--dourado); color:var(--petrol); }

:focus-visible{
  outline: 2px solid var(--dourado);
  outline-offset: 3px;
  border-radius: 2px;
}

.wrap{
  max-width:var(--wrap);
  margin:0 auto;
  padding-left:var(--pad);
  padding-right:var(--pad);
}

.wrap-narrow{
  max-width:760px;
  margin:0 auto;
  padding-left:var(--pad);
  padding-right:var(--pad);
}

/* ---------------- Typography ---------------- */

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:700;
  line-height:1.1;
  margin:0;
  color:var(--ink);
  letter-spacing:-0.005em;
}

.display-1{
  font-size:clamp(2.5rem, 5vw, 4.2rem);
  font-weight:700;
  line-height:1.06;
}
.display-2{
  font-size:clamp(1.7rem, 3.4vw, 3rem);
  font-weight:700;
  line-height:1.2;
}
.display-3{
  font-size:clamp(1.5rem, 2.4vw, 2.1rem);
  font-weight:700;
  line-height:1.2;
}
.display-1, .display-2, .display-3{ text-align:inherit; hyphens:none; }

.lede{
  font-family:var(--display);
  font-style:italic;
  font-weight:400;
  font-size:clamp(1.25rem, 1.9vw, 1.55rem);
  line-height:1.5;
  color:var(--petrol);
  max-width:36em;
}
:root[data-theme="dark"] .lede{ color:var(--creme); }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .lede{ color:var(--creme); }
}

p{ margin:0 0 1.1em; max-width:64ch; color:var(--ink-soft); text-align:justify; text-align-last:left; hyphens:auto; }
p:last-child{ margin-bottom:0; }
p strong{ color:var(--ink); }

.eyebrow{
  font-family:var(--body);
  font-size:0.8rem;
  font-weight:700;
  letter-spacing:0.06em;
  color:var(--eyebrow);
  margin:0 0 14px;
}

.rule{
  width:44px;
  height:2px;
  background:var(--dourado);
  border:0;
  margin:0 0 20px;
}
.rule.center{ margin-left:auto; margin-right:auto; }

.small{ font-size:0.92rem; color:var(--ink-soft); }

/* ---------------- Buttons: rounded, brand-color, soft shadow / dark-mode glow ---------------- */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:10px;
  font-family:var(--body);
  font-weight:700;
  font-size:0.97rem;
  padding:15px 30px;
  border-radius:var(--radius-pill);
  border:1px solid transparent;
  cursor:pointer;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .2s var(--ease), box-shadow .3s var(--ease);
}
.btn-primary{
  background: linear-gradient(135deg, var(--petrol-2), var(--petrol));
  color:var(--creme);
  box-shadow: var(--shadow-btn);
}
.btn-primary:hover{ transform:translateY(-2px); filter:brightness(1.08); }
.btn-gold{
  background: linear-gradient(135deg, var(--dourado-2), var(--dourado));
  color:var(--petrol);
  box-shadow: 0 10px 28px -10px rgba(199,168,106,0.55);
}
:root[data-theme="dark"] .btn-gold{ box-shadow: 0 0 30px rgba(199,168,106,0.4); }
.btn-gold:hover{ transform:translateY(-2px); filter:brightness(1.05); }
.btn-ghost{
  background:transparent;
  color:var(--ink);
  border-color:var(--line);
}
.btn-ghost:hover{ background:var(--surface); border-color:var(--petrol-2); transform:translateY(-1px); }
.btn-creme{
  background: linear-gradient(135deg, #FBF8F1 0%, var(--creme) 55%, #E9DDC3 100%);
  color:var(--petrol);
  box-shadow: 0 8px 20px -8px rgba(0,0,0,0.35);
}
.btn-creme:hover{ background: linear-gradient(135deg, var(--creme) 0%, var(--dourado-2) 100%); transform:translateY(-2px); }

/* ---------------- Theme toggle ---------------- */

.theme-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px; height:42px;
  border-radius:50%;
  border:1px solid var(--line);
  background:var(--surface);
  cursor:pointer;
  color:var(--ink);
  flex-shrink:0;
  transition: background .3s var(--ease), transform .2s var(--ease), box-shadow .3s var(--ease);
}
.theme-toggle:hover{ transform:translateY(-1px); box-shadow: var(--shadow-btn); }
.theme-toggle svg{ width:19px; height:19px; }
.theme-toggle .icon-moon{ display:none; }
:root[data-theme="dark"] .theme-toggle .icon-sun{ display:none; }
:root[data-theme="dark"] .theme-toggle .icon-moon{ display:block; }

/* ---------------- Header ---------------- */

.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.site-header .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:96px;
}
.brand{ display:flex; align-items:center; height:58px; }
.brand img{ height:56px; width:auto; }
.brand .logo-dark{ display:block; }
.brand .logo-light{ display:none; }
:root[data-theme="dark"] .brand .logo-dark{ display:none; }
:root[data-theme="dark"] .brand .logo-light{ display:block; }

/* Generic theme-swap pair for any logo/mark outside the header (same on/off logic as .brand above) */
.theme-logo-dark{ display:block; }
.theme-logo-light{ display:none; }
:root[data-theme="dark"] .theme-logo-dark{ display:none; }
:root[data-theme="dark"] .theme-logo-light{ display:block; }

.nav-desktop{
  display:flex;
  align-items:center;
  gap:34px;
}
.nav-desktop a{
  font-size:0.9rem;
  font-weight:700;
  letter-spacing:0.01em;
  color:var(--ink);
  position:relative;
  padding:6px 0;
}
.nav-desktop a::after{
  content:'';
  position:absolute;
  left:0; right:0; bottom:0;
  height:2px;
  background:var(--dourado);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s var(--ease);
}
.nav-desktop a:hover::after,
.nav-desktop a[aria-current="page"]::after{ transform:scaleX(1); }
.nav-desktop a[aria-current="page"]{ color:var(--petrol-2); }
:root[data-theme="dark"] .nav-desktop a[aria-current="page"]{ color:var(--dourado-2); }

.nav-cta{ display:flex; align-items:center; gap:14px; }
.nav-cta .btn{ padding:12px 22px; font-size:0.88rem; }

.menu-toggle{
  display:none;
  background:none;
  border:0;
  cursor:pointer;
  padding:8px;
  width:40px; height:40px;
  flex-direction:column;
  justify-content:center;
  gap:5px;
}
.menu-toggle span{
  display:block; height:2px; width:100%;
  background:var(--ink);
  transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.menu-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.nav-mobile{
  display:none;
  position:fixed;
  inset:96px 0 0 0;
  background:var(--bg);
  padding:32px var(--pad);
  overflow-y:auto;
  z-index:99;
}
.nav-mobile a{
  display:block;
  font-family:var(--display);
  font-size:1.7rem;
  font-weight:700;
  padding:14px 0;
  border-bottom:1px solid var(--line);
  color:var(--ink);
}
.nav-mobile .btn{ margin-top:24px; width:100%; justify-content:center; }
.nav-mobile .btn-primary{ color:var(--creme); }
.nav-mobile .btn-gold{ color:var(--petrol); }

body.nav-open .nav-mobile{ display:block; }

@media (max-width:900px){
  .nav-desktop, .nav-cta .btn-ghost{ display:none; }
  .menu-toggle{ display:flex; }
}

/* ---------------- Sections ---------------- */

section{ position:relative; }
.section{ padding: clamp(64px, 9vw, 128px) 0; }
.section-tight{ padding: clamp(44px, 6vw, 80px) 0; }

.bg-surface{ background:var(--surface); }
.bg-alt{ background:var(--bg-alt); }
.bg-petrol{ background:var(--petrol); color:var(--creme); }
.bg-petrol h1, .bg-petrol h2, .bg-petrol h3, .bg-petrol h4{ color:var(--creme); }
.bg-petrol .lede{ color:var(--dourado-2); }
.bg-petrol p{ color:rgba(242,237,228,0.82); }
.bg-petrol .rule{ background:var(--dourado); }
.bg-petrol .eyebrow{ color:var(--dourado-2); }
.bg-petrol .btn-ghost{ color:var(--creme); border-color:rgba(242,237,228,0.35); }
.bg-petrol .btn-ghost:hover{ background:rgba(242,237,228,0.1); border-color:var(--dourado); }

.border-top{ border-top:1px solid var(--line); }

/* organic divider echoing the logo's swoosh — breaks the hairline-grid default */
.curve-divider{
  height:64px;
  margin-top:-1px;
  background:var(--bg);
}
.curve-divider svg{ width:100%; height:100%; display:block; }

/* ---------------- Hero (humanized: real photo, asymmetric) ---------------- */

.hero{
  padding: clamp(48px, 7vw, 84px) 0 0;
  overflow:hidden;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1fr 0.92fr;
  gap: clamp(28px, 5vw, 56px);
  align-items:center;
}
.hero-copy .eyebrow{ margin-bottom:18px; }
.hero h1{ margin-bottom:24px; }
.hero .lede{ margin-bottom:32px; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
@media (max-width:600px){
  .hero-actions, .cta-actions{ justify-content:center; }
  .hero-actions .btn, .cta-actions .btn{ width:100%; }
}

.hero-media{
  position:relative;
  aspect-ratio: 4/5;
  border-radius: 32px 32px 32px 120px;
  overflow:hidden;
  box-shadow: var(--shadow-card);
}
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-media::after{
  content:'';
  position:absolute; inset:0;
  background: linear-gradient(200deg, rgba(13,43,46,0) 45%, rgba(13,43,46,0.55));
}
.hero-media .hero-tag{
  position:absolute; left:24px; bottom:24px; z-index:2;
  color:var(--creme);
  font-family:var(--display);
  font-style:italic;
  font-size:1.05rem;
  max-width:80%;
}
@media (max-width:860px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-media{ aspect-ratio:5/4; order:-1; border-radius:24px 24px 24px 80px; }
}

/* ---------------- Hero, full-bleed background photo variant ---------------- */

.hero-photo{ position:relative; }
.hero-photo .hero-photo-img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:50% 20%;
  opacity:0.4;
  z-index:0;
}
.hero-photo::before{
  content:'';
  position:absolute; inset:0;
  background: linear-gradient(100deg, var(--bg) 0%, var(--bg) 30%, color-mix(in srgb, var(--bg) 45%, transparent) 58%, color-mix(in srgb, var(--bg) 15%, transparent) 100%);
  z-index:1;
}
.hero-photo > .wrap{ position:relative; z-index:2; }
.hero-photo .hero-copy{ max-width:34em; }
@media (max-width:760px){
  .hero-photo::before{ background: linear-gradient(180deg, var(--bg) 0%, var(--bg) 45%, color-mix(in srgb, var(--bg) 35%, transparent) 80%); }
}

/* Full-bleed variant: the whole photo stays visible (no directional crop-reveal),
   just a soft uniform tint over it so the text keeps reading everywhere. */
.hero-photo-full .hero-photo-img{ opacity:0.4; object-position:50% 42%; }
.hero-photo-full::before{ background: color-mix(in srgb, var(--bg) 58%, transparent); }

/* ---------------- Path split (Business / Life&Career) ---------------- */

.paths{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:36px;
  padding: 0 var(--pad);
  max-width:var(--wrap);
  margin: 0 auto;
}
.path-card{
  position:relative;
  padding: clamp(32px, 3.5vw, 48px) clamp(24px, 3vw, 36px);
  min-height:320px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  isolation:isolate;
  border-radius: 8px;
}
.path-card.business{
  background: linear-gradient(155deg, var(--petrol) 0%, #0A2224 100%);
  color:var(--creme);
  border-radius: var(--radius-card);
}
.path-card.movimentos{
  background: linear-gradient(160deg, #F4F8F5 0%, #CBDCD2 45%, #8FAF9F 100%);
  color:var(--petrol);
  border-radius: var(--radius-card);
}
.path-card.lifecareer{
  background: #EDE4D2;
  color:var(--petrol);
  border-radius: var(--radius-card);
}
.path-card .path-tag{
  font-size:0.78rem; font-weight:700; letter-spacing:0.08em;
  margin-bottom:12px; opacity:0.85;
}
.path-card.business .path-tag{ color:var(--dourado-2); }
.path-card.movimentos .path-tag{ color:var(--petrol); }
.path-card.lifecareer .path-tag{ color:var(--petrol); }
.path-card h3{ font-size:clamp(1.3rem,2vw,1.7rem); margin-bottom:14px; line-height:1; }
.path-card .path-logo{ height:clamp(56px,7.5vw,80px); width:auto; display:block; }

/* Small tracked tagline that sits under a logomarca — "CONECTAR · ORGANIZAR · REALIZAR · EVOLUIR" etc.
   Theme-reactive by default (dark petrol in light mode, gold in dark mode); path-cards override
   to their own fixed card color since those cards don't change with the site theme toggle. */
.logo-tagline{
  font-family:var(--body);
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.1em;
  color:var(--petrol);
  margin-top:4px;
}
h3:has(+ .logo-tagline){ margin-bottom:6px; }
:root[data-theme="dark"] .logo-tagline{ color:var(--dourado-2); }
.path-card.business .logo-tagline{ color:var(--dourado-2); }
.path-card.movimentos .logo-tagline{ color:var(--petrol); }
.path-card.lifecareer .logo-tagline{ color:var(--petrol); }
.path-card .logo-tagline{ font-size:0.62rem; letter-spacing:0.06em; white-space:nowrap; }
.path-card.business h3{ color:var(--creme); }
.path-card.lifecareer h3{ color:var(--petrol); }
.path-card p{ margin-bottom:18px; opacity:0.92; color:inherit; max-width:32em; font-size:0.94rem; }
.path-card .path-link{
  display:inline-flex; align-items:center; gap:10px;
  font-weight:700; font-size:0.88rem;
  padding:10px 18px;
  border-radius:var(--radius-pill);
  background:var(--creme);
  color:var(--petrol);
  box-shadow: 0 8px 20px -8px rgba(0,0,0,0.35);
  width:fit-content;
  transition: background .25s var(--ease), transform .2s var(--ease);
}
.path-card.business .path-link:hover{ background:var(--dourado-2); }
.path-card.movimentos .path-link{ background:var(--petrol); color:var(--creme); box-shadow: 0 8px 20px -8px rgba(13,43,46,0.45); }
.path-card.movimentos .path-link:hover{ background:#0A2224; }
.path-card.lifecareer .path-link{ background:var(--petrol); color:var(--creme); box-shadow: 0 8px 20px -8px rgba(13,43,46,0.45); }
.path-card.lifecareer .path-link:hover{ background:#0A2224; }
.path-card:hover .path-link{ transform:translateX(4px); }
.path-card .glyph{
  position:absolute; right:-8%; top:50%; transform:translateY(-50%);
  width:55%; max-width:300px; opacity:0.16; pointer-events:none;
}
.path-card.lifecareer .glyph{ opacity:0.22; }
@media (max-width:960px){
  .paths{ grid-template-columns:1fr; gap:16px; }
}

/* ---------------- Belief / statement block ---------------- */

.statement{
  text-align:center;
  max-width:900px;
  margin:0 auto;
}
.statement .display-2{ font-style:italic; font-weight:400; }

/* ---------------- CORE method ---------------- */

.core-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:48px;
}
.core-cell{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-card);
  padding:32px 26px;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.core-cell:hover{ transform:translateY(-4px); box-shadow:var(--shadow-card); }
.core-letter{
  font-family:var(--display);
  font-size:2.8rem;
  font-weight:700;
  color:var(--dourado);
  line-height:1;
  margin-bottom:16px;
}
.core-cell h4{ font-size:1.1rem; margin-bottom:10px; }
.core-cell .core-q{
  display:block; margin-top:14px;
  font-style:italic; font-family:var(--display); font-size:0.96rem;
  color:var(--petrol-2);
}
:root[data-theme="dark"] .core-cell .core-q{ color:var(--dourado-2); }
@media (max-width:860px){ .core-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .core-grid{ grid-template-columns:1fr; } }

/* ---------------- Pillars / dimensions list ---------------- */

.dim-list{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:0;
  margin-top:40px;
  border-top:1px solid var(--line);
}
.dim-item{
  padding:26px 22px 26px 0;
  border-bottom:1px solid var(--line);
}
.dim-item h4{ font-size:1.05rem; margin-bottom:8px; color:var(--petrol-2); }
:root[data-theme="dark"] .dim-item h4{ color:var(--dourado-2); }
.dim-item p{ font-size:0.94rem; }

/* ---------------- Media + text split (humanizes long sections) ---------------- */

.split{
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap:clamp(28px,5vw,64px);
  align-items:center;
}
.split.reverse{ grid-template-columns: 1.15fr 0.85fr; }
.split.reverse .split-media{ order:2; }
.split-media{
  border-radius:var(--radius-card);
  overflow:hidden;
  box-shadow:var(--shadow-card);
  aspect-ratio:4/5;
}
.split-media img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:860px){
  .split, .split.reverse{ grid-template-columns:1fr; }
  .split.reverse .split-media{ order:0; }
}

/* ---------------- Service / offer blocks ---------------- */

.offer{
  display:grid;
  grid-template-columns: 0.9fr 1.6fr;
  gap:clamp(28px,4vw,64px);
  padding: clamp(40px,5vw,60px) 0;
}
.offer + .offer{ border-top:1px solid var(--line); }
.offer-label h3{ font-size:clamp(1.35rem,2.1vw,1.8rem); }
.offer-label .small{ margin-top:10px; display:block; }
.offer-body .lede{ margin-bottom:18px; font-size:1.12rem; }
.offer-body p{ max-width:62ch; }
@media (max-width:760px){ .offer{ grid-template-columns:1fr; } }

/* ---------------- Recognition (talvez) list ---------------- */

.maybe-list{ display:grid; gap:0; margin-top:8px; }
.maybe-item{
  padding:22px 0;
  border-bottom:1px solid var(--line);
  font-family:var(--display);
  font-size:clamp(1.05rem,1.8vw,1.32rem);
  font-style:italic;
  color:var(--petrol-2);
}
:root[data-theme="dark"] .maybe-item{ color:var(--dourado-2); }

/* ---------------- Quote / evidence card ---------------- */

.quote-card{
  background:var(--surface);
  border-radius:var(--radius-card);
  border-left:3px solid var(--dourado);
  padding: 34px clamp(22px,4vw,46px);
  box-shadow:var(--shadow-card);
}
.quote-card p{ font-family:var(--display); font-style:italic; font-size:1.2rem; color:var(--ink); }
.quote-card .who{ font-family:var(--body); font-style:normal; font-size:0.86rem; color:var(--ink-soft); margin-top:14px; font-weight:700; }

/* ---------------- Team / founder cards ---------------- */

.team-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(24px,4vw,40px);
  margin-top:40px;
}
.team-card{
  background:var(--surface);
  border-radius:var(--radius-card);
  overflow:hidden;
  border:1px solid var(--line);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.team-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-card); }
.team-card .team-photo{ aspect-ratio:4/5; overflow:hidden; }
.team-card .team-photo img{ width:100%; height:100%; object-fit:cover; object-position:top center; }
.team-card .team-body{ padding:26px 26px 30px; }
.team-card h4{ font-size:1.25rem; margin-bottom:4px; }
.team-card .team-role{ color:var(--petrol-2); font-weight:700; font-size:0.9rem; margin-bottom:14px; display:block; }
:root[data-theme="dark"] .team-card .team-role{ color:var(--dourado-2); }
.team-card ul{ margin:0; padding:0; list-style:none; }
.team-card li{
  font-size:0.9rem; color:var(--ink-soft);
  padding:7px 0 7px 18px; position:relative;
  border-top:1px solid var(--line);
}
.team-card li:first-child{ border-top:0; }
.team-card li::before{
  content:'';
  position:absolute; left:0; top:15px;
  width:6px; height:6px; border-radius:50%;
  background:var(--dourado);
}
@media (max-width:760px){ .team-grid{ grid-template-columns:1fr; } }

/* ---------------- Founder section ---------------- */

.founder-grid{
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap:clamp(32px,6vw,72px);
  align-items:center;
}
.founder-photo{
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--bg-alt);
  border-radius:var(--radius-card);
  box-shadow:var(--shadow-card);
}
.founder-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; }
@media (max-width:860px){ .founder-grid{ grid-template-columns:1fr; } }

/* ---------------- Section watermark (the brand glyph, oversized and faint — never a wave divider) ---------------- */

.section-glyph{ position:relative; overflow:hidden; }
.section-glyph .glyph-mark{
  position:absolute;
  top:50%; right:clamp(-80px,-6vw,-20px);
  transform:translateY(-50%);
  height:180%;
  width:auto;
  opacity:var(--glyph-opacity);
  pointer-events:none;
  z-index:0;
}
.section-glyph > .wrap{ position:relative; z-index:1; }

/* ---------------- Stat band (credibility numbers, never fabricated) ---------------- */

.stat-band{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:var(--radius-card);
  overflow:hidden;
  margin-top:44px;
}
.stat-cell{
  background:var(--surface);
  padding:34px 22px;
  text-align:center;
}
.stat-cell .stat-num{
  font-family:var(--display);
  font-size:clamp(2.2rem,4vw,3rem);
  font-weight:700;
  color:var(--petrol-2);
  line-height:1;
  display:block;
  margin-bottom:10px;
}
:root[data-theme="dark"] .stat-cell .stat-num{ color:var(--dourado-2); }
.stat-cell .stat-label{
  font-size:0.85rem;
  color:var(--ink-soft);
  line-height:1.4;
}
@media (max-width:760px){ .stat-band{ grid-template-columns:1fr 1fr; } }
@media (max-width:460px){ .stat-band{ grid-template-columns:1fr; } }

/* ---------------- Process steps (grounded in the brand's own described method) ---------------- */

.process{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(24px,4vw,40px);
  margin-top:48px;
  counter-reset:process;
}
.process-step{ position:relative; padding-top:8px; }
.process-step::before{
  counter-increment:process;
  content:counter(process);
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px; height:44px;
  border-radius:50%;
  background:var(--petrol);
  color:var(--dourado-2);
  font-family:var(--display);
  font-weight:700;
  font-size:1.1rem;
  margin-bottom:20px;
}
:root[data-theme="dark"] .process-step::before{
  background: linear-gradient(135deg, var(--dourado-2), var(--dourado) 55%, var(--gold-700, #9C7530));
  color:var(--petrol);
  box-shadow: 0 0 18px rgba(199,168,106,0.35);
}
.process-step h4{ font-family:var(--display); font-weight:700; font-size:1.1rem; margin-bottom:6px; }
.process-step .process-q{
  display:block; margin-bottom:12px;
  font-style:italic; font-family:var(--display); font-size:0.92rem;
  color:var(--petrol-2);
}
:root[data-theme="dark"] .process-step .process-q{ color:var(--dourado-2); }
.process-step p{ font-size:0.95rem; }

/* ---------------- Solutions highlight grid (3 elegant cards) ---------------- */

.solutions-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:40px;
}
.solution-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-card);
  padding:32px 28px;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.solution-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-card); }
.solution-card h3{ font-size:1.08rem; margin-bottom:10px; line-height:1.3; }
.solution-card p{ font-size:0.94rem; color:var(--ink-soft); }
@media (max-width:860px){ .solutions-grid{ grid-template-columns:1fr; } }
.process-step:not(:last-child)::after{
  content:'';
  position:absolute;
  top:22px; left:64px; right:-20px;
  height:1px;
  background:var(--line);
  display:none;
}
@media (min-width:761px){ .process-step:not(:last-child)::after{ display:block; } }
@media (max-width:760px){ .process{ grid-template-columns:1fr; gap:32px; } }

/* ---------------- Editorial facts grid (light, no heavy cards) ---------------- */

.editorial-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:28px;
  margin-top:28px;
}
.editorial-item{
  border-top:1px solid var(--line);
  padding-top:16px;
}
.editorial-item h4{
  font-size:0.82rem; font-weight:700; letter-spacing:0.04em;
  text-transform:uppercase; margin-bottom:10px;
  color:var(--petrol-2);
}
:root[data-theme="dark"] .editorial-item h4{ color:var(--dourado-2); }
.editorial-item p{ font-size:0.92rem; color:var(--ink-soft); }
@media (max-width:860px){ .editorial-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .editorial-grid{ grid-template-columns:1fr; } }

/* ---------------- Timeline (career / brand story) ---------------- */

.timeline{ margin-top:44px; border-left:2px solid var(--line); padding-left:clamp(24px,4vw,40px); }
.timeline-item{ position:relative; padding-bottom:40px; }
.timeline-item:last-child{ padding-bottom:0; }
.timeline-item::before{
  content:'';
  position:absolute;
  left:calc(-1 * clamp(24px,4vw,40px) - 6px);
  top:4px;
  width:11px; height:11px;
  border-radius:50%;
  background: linear-gradient(135deg, var(--dourado-2), var(--dourado) 55%, #9C7530);
  box-shadow:0 0 0 4px var(--bg);
}
:root[data-theme="dark"] .timeline-item::before{ box-shadow:0 0 0 4px var(--bg), 0 0 10px rgba(199,168,106,0.4); }
.timeline-item .timeline-year{
  font-family:var(--display);
  font-style:italic;
  color:var(--petrol-2);
  font-size:0.95rem;
  margin-bottom:6px;
  display:block;
}
:root[data-theme="dark"] .timeline-item .timeline-year{ color:var(--dourado-2); }
.timeline-item h4{ font-size:1.15rem; margin-bottom:8px; }
.timeline-item p{ font-size:0.95rem; }

/* ---------------- Next-steps rail (contact page: what happens after you reach out) ---------------- */

.rail{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  margin-top:8px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.rail-step{
  padding:28px 24px;
  border-left:1px solid var(--line);
}
.rail-step:first-child{ border-left:0; }
.rail-step .rail-num{
  font-family:var(--display);
  font-style:italic;
  color:var(--dourado);
  font-size:1.3rem;
  display:block;
  margin-bottom:10px;
}
.rail-step h5{ font-family:var(--display); font-size:1.05rem; font-weight:700; margin-bottom:8px; color:var(--ink); }
.rail-step p{ font-size:0.9rem; }
@media (max-width:760px){
  .rail{ grid-template-columns:1fr; border-bottom:0; }
  .rail-step{ border-left:0; border-bottom:1px solid var(--line); }
  .rail-step:last-child{ border-bottom:0; }
}

/* ---------------- WhatsApp floating button ---------------- */

.whatsapp-fab{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:150;
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#25D366;
  box-shadow:0 12px 28px -8px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.08);
  transition: transform .25s var(--ease), box-shadow .3s var(--ease);
}
.whatsapp-fab svg{ width:30px; height:30px; }
.whatsapp-fab:hover{
  transform:translateY(-3px) scale(1.05);
  box-shadow:0 16px 34px -8px rgba(0,0,0,0.48), 0 0 0 1px rgba(255,255,255,0.12);
}
:root[data-theme="dark"] .whatsapp-fab{
  box-shadow:0 0 0 1px rgba(37,211,102,0.35), 0 0 26px rgba(37,211,102,0.4);
}
:root[data-theme="dark"] .whatsapp-fab:hover{
  box-shadow:0 0 0 1px rgba(37,211,102,0.5), 0 0 34px rgba(37,211,102,0.55);
}
@media (max-width:600px){
  .whatsapp-fab{ right:16px; bottom:16px; width:52px; height:52px; }
  .whatsapp-fab svg{ width:26px; height:26px; }
}

/* ---------------- Chip row (differentials) ---------------- */

.chip-inline{
  display:inline-block;
  padding:2px 10px;
  border:1px solid rgba(242,237,228,0.35);
  border-radius:100px;
  font-weight:700;
  font-size:0.92em;
  margin:0 2px;
  color:inherit;
}
.chip-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.chip{
  border:1px solid var(--line);
  padding:10px 18px;
  font-size:0.86rem;
  font-weight:600;
  border-radius:100px;
}

/* ---------------- Footer ---------------- */

.site-footer{
  background:var(--petrol);
  color:var(--creme);
  padding: 72px 0 32px;
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom:48px;
  border-bottom:1px solid rgba(242,237,228,0.18);
}
.footer-brand img{ height:40px; width:auto; margin-bottom:18px; }
.footer-brand p{ font-size:0.92rem; color:rgba(242,237,228,0.68); max-width:32ch; }
.footer-col h5{
  font-family:var(--body); font-size:0.78rem; font-weight:700;
  letter-spacing:0.08em; color:var(--dourado-2); margin-bottom:16px;
}
.footer-col a, .footer-col p{
  display:block; font-size:0.92rem; color:rgba(242,237,228,0.82);
  margin-bottom:10px;
}
.footer-col a:hover{ color:var(--dourado-2); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:28px; font-size:0.82rem; color:rgba(242,237,228,0.55);
  flex-wrap:wrap; gap:12px;
}
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }

/* ---------------- Contact page ---------------- */

.contact-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:clamp(32px,6vw,72px);
}
.form-field{ margin-bottom:22px; }
.form-field label{
  display:block; font-size:0.86rem; font-weight:700;
  margin-bottom:8px; color:var(--ink);
}
.form-field input, .form-field textarea, .form-field select{
  width:100%;
  font-family:var(--body);
  font-size:1rem;
  padding:14px 18px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--ink);
  border-radius:14px;
  resize:vertical;
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{
  border-color:var(--dourado);
  outline:none;
}
.contact-info-item{ padding:22px 0; border-bottom:1px solid var(--line); }
.contact-info-item h5{ font-family:var(--body); font-size:0.78rem; font-weight:700; letter-spacing:0.08em; color:var(--eyebrow); margin-bottom:8px; }
.contact-info-item a, .contact-info-item p{ font-family:var(--display); font-size:1.2rem; color:var(--ink); }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }

/* ---------------- CTA band ---------------- */

.cta-band{ text-align:center; padding: clamp(64px,9vw,110px) 0; }
.cta-band .display-2{ margin-bottom:12px; }
.cta-band .tagline{
  font-family:var(--display); font-style:italic; color:var(--dourado);
  font-size:1.1rem; margin-bottom:12px; display:block;
}
.cta-actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-top:36px; }

/* ---------------- Utility ---------------- */

.mt-0{ margin-top:0 !important; }
.center{ text-align:center; }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,64px); }
@media (max-width:760px){ .two-col{ grid-template-columns:1fr; } }

.fade-up{
  opacity:0; transform:translateY(16px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.fade-up.in-view{ opacity:1; transform:translateY(0); }

.skip-link{
  position:absolute; left:-999px; top:auto;
  background:var(--petrol); color:var(--creme);
  padding:12px 20px; z-index:200;
  border-radius: 0 0 10px 0;
}
.skip-link:focus{ left:0; top:0; }
