/* ============================================================================
   DOERING & DARCIE — Website
   site.css — shared foundations + site components
   Editorial / classic / luxury-legal. Square corners only. Hairlines.
   ============================================================================ */

/* ---- Brand webfonts: Lora (local) ---------------------------------------- */
@font-face {
  font-family: 'Lora';
  src: url('../fonts/Lora-Regular.ttf') format('truetype');
  font-weight: 400 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Lora';
  src: url('../fonts/Lora-Bold.ttf') format('truetype');
  font-weight: 600 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Lora';
  src: url('../fonts/Lora-Italic.ttf') format('truetype');
  font-weight: 400 500; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Lora';
  src: url('../fonts/Lora-BoldItalic.ttf') format('truetype');
  font-weight: 600 700; font-style: italic; font-display: swap;
}

:root {
  /* ---- Core palette (locked) ---- */
  --cream:   #F6F4EF;
  --white:   #FEFEFE;
  --sand:    #EADBB9;
  --bone:    #EFEADB;
  --ice:     #F4F9FC;
  --navy:    #0D384B;
  --ink:     #0C2938;
  --petrol:  #14506B;  /* lighter petrol for placeholder gradients only */

  --navy-08: rgba(13, 56, 75, 0.08);
  --navy-12: rgba(13, 56, 75, 0.12);
  --navy-20: rgba(13, 56, 75, 0.20);
  --navy-40: rgba(13, 56, 75, 0.40);
  --navy-60: rgba(13, 56, 75, 0.60);

  --cream-20: rgba(246, 244, 239, 0.20);
  --cream-40: rgba(246, 244, 239, 0.40);
  --cream-55: rgba(246, 244, 239, 0.55);
  --cream-80: rgba(246, 244, 239, 0.80);
  --sand-50:  rgba(234, 219, 185, 0.50);

  --serif: 'Lora', Georgia, 'Times New Roman', serif;
  --sans:  'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* web layout */
  --maxw: 1200px;
  --gutter: clamp(24px, 5vw, 88px);
  --nav-h: 76px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--navy);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

/* ============================================================================
   BROWSER CHROME (domain frame) — meta, not a brand surface
   ============================================================================ */
.browser-bar {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; gap: 14px;
  height: 44px; padding: 0 16px;
  background: #E7E4DD;
  border-bottom: 1px solid rgba(0,0,0,0.10);
  font-family: var(--sans);
}
.browser-dots { display: flex; gap: 8px; }
.browser-dots span { width: 12px; height: 12px; border-radius: 50%; background: #C9C5BC; }
.browser-dots span:nth-child(1) { background: #E0928B; }
.browser-dots span:nth-child(2) { background: #E7C98A; }
.browser-dots span:nth-child(3) { background: #A9C6A0; }
.browser-address {
  flex: 1; display: flex; align-items: center; gap: 9px;
  height: 28px; padding: 0 14px;
  background: #F6F4EF; border: 1px solid rgba(0,0,0,0.08);
  border-radius: 7px;
  font-size: 13px; color: var(--navy-60); letter-spacing: 0.01em;
  max-width: 560px; margin: 0 auto;
  white-space: nowrap; overflow: hidden;
}
.browser-address svg { width: 12px; height: 12px; flex: none; opacity: 0.55; }
.browser-address b { color: var(--navy); font-weight: 600; }
.browser-address .path { color: var(--navy); }

/* ============================================================================
   SITE NAV
   ============================================================================ */
.nav {
  position: sticky; top: 0; z-index: 90;
  background: rgba(246,244,239,0.92);
  backdrop-filter: saturate(120%) blur(6px);
  border-bottom: 1px solid var(--navy-12);
}
.nav-inner {
  max-width: var(--maxw); margin: 0 auto;
  height: var(--nav-h); padding: 0 var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
}
/* ---- Logo lockup: DD monogram + wordmark + advocacia & consultoria ---- */
.nav-logo { display: flex; align-items: center; gap: 13px; }
.nav-logo .mono { height: 42px; width: auto; flex: none; }
.nav-logo .lockup { display: flex; flex-direction: column; gap: 3px; line-height: 1; }
.nav-logo .wordmark { font-family: var(--serif); font-size: 20px; font-weight: 500; letter-spacing: 0.02em; color: var(--navy); white-space: nowrap; line-height: 1; }
.nav-logo .subline { font-family: var(--sans); font-size: 9.5px; font-weight: 600; letter-spacing: 0.34em; text-transform: uppercase; color: var(--navy-40); white-space: nowrap; }

.nav-links { display: flex; align-items: center; gap: 28px; }
.nav-item { position: relative; }
.nav-links a, .nav-item > button {
  font-family: var(--sans); font-size: 14px; font-weight: 500; color: var(--navy);
  letter-spacing: 0.01em; padding: 6px 0; position: relative; cursor: pointer;
  transition: opacity .18s ease; white-space: nowrap;
  background: none; border: 0; display: inline-flex; align-items: center; gap: 6px;
}
.nav-links a:hover, .nav-item > button:hover { opacity: 0.6; }
.nav-item > button .caret { width: 11px; height: 11px; transition: transform .2s ease; }
.nav-item.open > button .caret { transform: rotate(180deg); }
.nav-links a.active::after, .nav-item.active > button::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px;
  height: 2px; background: var(--sand);
}
/* dropdown */
.nav-menu {
  position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%) translateY(-6px);
  min-width: 248px; background: var(--white); border: 1px solid var(--navy-12);
  box-shadow: 0 18px 44px rgba(13,56,75,0.13); padding: 8px;
  opacity: 0; visibility: hidden; transition: opacity .18s ease, transform .18s ease; z-index: 95;
}
.nav-item:hover .nav-menu, .nav-item.open .nav-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-menu::before { content:""; position:absolute; left:0; right:0; top:-14px; height:14px; }
.nav-menu a {
  display: block; padding: 12px 14px; font-size: 13.5px; font-weight: 500; color: var(--navy);
  border-bottom: 1px solid var(--navy-08); white-space: nowrap; opacity: 1;
}
.nav-menu a:last-child { border-bottom: 0; }
.nav-menu a .mtag { display:block; font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sand); margin-bottom: 3px; }
.nav-menu a:hover { background: var(--navy-08); opacity: 1; }
.nav-menu.right { left: auto; right: 0; transform: translateY(-6px); }
.nav-item:hover .nav-menu.right, .nav-item.open .nav-menu.right { transform: translateY(0); }

/* nested flyout (Atuação frentes -> areas) */
.nav-sub { position: relative; }
.nav-flyout {
  position: absolute; left: 100%; top: -8px; margin-left: 1px;
  min-width: 240px; background: var(--white); border: 1px solid var(--navy-12);
  box-shadow: 0 18px 44px rgba(13,56,75,0.13); padding: 8px;
  opacity: 0; visibility: hidden; transform: translateX(-6px);
  transition: opacity .18s ease, transform .18s ease; z-index: 96;
}
.nav-sub:hover .nav-flyout { opacity: 1; visibility: visible; transform: translateX(0); }
.nav-flyout a { display:block; padding: 10px 12px; font-size: 13px; font-weight: 500; color: var(--navy); border-bottom: 1px solid var(--navy-08); white-space: nowrap; }
.nav-flyout a:last-child { border-bottom: 0; }
.nav-flyout a:hover { background: var(--navy-08); }

.nav-tools { display: flex; align-items: center; gap: 18px; }
.nav-tools .lang { font-size: 13px; font-weight: 600; letter-spacing: 0.08em; color: var(--navy-60); }
.lang-item > button { padding: 6px 0; }
.lang-item .caret { width: 11px; height: 11px; }
.lang-item.open > button .caret { transform: rotate(180deg); }
.nav-burger { display: none; width: 26px; height: 26px; color: var(--navy); background: none; border: 0; cursor: pointer; padding: 0; }

/* mobile drawer */
.nav-drawer { display: none; }
@media (max-width: 980px) {
  .nav-links { display: none; }
  .nav-burger { display: block; }
  .nav-drawer {
    display: block; position: fixed; inset: 0; z-index: 200;
    background: var(--cream); padding: 24px var(--gutter);
    transform: translateX(100%); transition: transform .28s ease; overflow-y: auto;
  }
  .nav-drawer.open { transform: none; }
  .nav-drawer .dclose { position: absolute; top: 24px; right: var(--gutter); width: 28px; height: 28px; background: none; border: 0; color: var(--navy); cursor: pointer; }
  .nav-drawer .dgroup { border-bottom: 1px solid var(--navy-12); }
  .nav-drawer a, .nav-drawer .dlabel { display: block; font-family: var(--serif); font-size: 24px; color: var(--navy); padding: 16px 0; }
  .nav-drawer .dsub a { font-family: var(--sans); font-size: 16px; color: var(--navy-60); padding: 8px 0 8px 18px; }
  .nav-drawer .dlabel { font-size: 13px; font-family: var(--sans); font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--navy-40); padding-bottom: 4px; }
}

/* ============================================================================
   LAYOUT PRIMITIVES
   ============================================================================ */
.container { max-width: var(--maxw); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.section { padding: clamp(64px, 9vw, 130px) 0; }
.section.tight { padding: clamp(48px, 6vw, 84px) 0; }
.ground-navy { background: var(--navy); color: var(--cream); }
.ground-ink  { background: var(--ink);  color: var(--cream); }
.ground-bone { background: var(--bone); }
.ground-ice  { background: var(--ice); }

.rule { height: 1px; background: var(--navy-20); border: 0; width: 100%; }
.ground-navy .rule, .ground-ink .rule { background: var(--cream-40); }

/* ---- Type helpers (web scale) ---- */
.eyebrow {
  font-family: var(--sans); font-size: 13px; font-weight: 600;
  letter-spacing: 0.24em; text-transform: uppercase; color: var(--navy-60);
  margin: 0 0 22px;
}
.ground-navy .eyebrow, .ground-ink .eyebrow { color: var(--sand); }
.display {
  font-family: var(--serif); font-weight: 400; line-height: 1.04;
  letter-spacing: -0.01em; margin: 0;
  font-size: clamp(40px, 6vw, 72px);
}
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; letter-spacing: -0.005em; margin: 0; }
h2 { font-size: clamp(30px, 3.6vw, 46px); line-height: 1.1; }
h3 { font-size: clamp(21px, 2vw, 27px); line-height: 1.2; font-weight: 500; }
.emph { font-family: var(--serif); font-style: italic; font-weight: 400; }
.ground-navy .emph, .ground-ink .emph { color: var(--sand); }

.lead {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(18px, 1.7vw, 21px); line-height: 1.6; color: var(--navy-60);
  margin: 0;
}
.ground-navy .lead, .ground-ink .lead { color: var(--cream-80); }
p.body, .body { font-family: var(--sans); font-size: 16.5px; line-height: 1.65; color: var(--navy-60); margin: 0 0 1em; }
.ground-navy .body, .ground-ink .body { color: var(--cream-80); }
.kicker { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.6; }

/* ---- Buttons ---- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--sans); font-size: 14px; font-weight: 600;
  letter-spacing: 0.02em; padding: 14px 26px; border: 1px solid var(--navy);
  background: var(--navy); color: var(--cream); cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.btn:hover { background: var(--ink); }
.btn.ghost { background: transparent; color: var(--navy); }
.btn.ghost:hover { background: var(--navy); color: var(--cream); }
.ground-navy .btn, .ground-ink .btn { background: var(--sand); color: var(--navy); border-color: var(--sand); }
.ground-navy .btn:hover, .ground-ink .btn:hover { background: var(--cream); border-color: var(--cream); }
.ground-navy .btn.ghost, .ground-ink .btn.ghost { background: transparent; color: var(--cream); border-color: var(--cream-55); }
.ground-navy .btn.ghost:hover, .ground-ink .btn.ghost:hover { background: var(--cream); color: var(--navy); }
.btn .arw { width: 15px; height: 15px; }

.textlink {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--sans); font-size: 14px; font-weight: 600; letter-spacing: 0.02em;
  color: var(--navy); border-bottom: 1px solid var(--navy-40); padding-bottom: 3px;
  transition: gap .18s ease, border-color .18s ease;
}
.textlink:hover { gap: 13px; border-color: var(--navy); }
.ground-navy .textlink, .ground-ink .textlink { color: var(--sand); border-color: var(--sand-50); }
.textlink .arw { width: 14px; height: 14px; }

/* ============================================================================
   HERO (interior pages) — navy editorial band
   ============================================================================ */
.hero {
  background: var(--navy); color: var(--cream);
  padding: clamp(70px, 10vw, 130px) 0 clamp(60px, 8vw, 104px);
  position: relative; overflow: hidden;
}
.hero .container { position: relative; z-index: 2; }
.hero .eyebrow { color: var(--sand); }
.hero .display { color: var(--cream); max-width: 16ch; }
.hero .lead { color: var(--cream-80); max-width: 52ch; margin-top: 26px; }
.hero-watermark {
  position: absolute; right: -60px; bottom: -90px; width: clamp(280px, 36vw, 520px);
  opacity: 0.06; z-index: 1; pointer-events: none;
}
.hero-watermark img { width: 100%; filter: brightness(0) invert(1); }

/* ---- Photo placeholder (navy/petrol gradient + inset hairline + caption) -- */
.photo {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, var(--navy) 0%, var(--petrol) 100%);
  border: 1px solid var(--navy-20);
}
.photo.on-dark { border-color: var(--cream-40); }
.photo::after {
  content: ""; position: absolute; inset: 12px; border: 1px solid var(--cream-40);
  pointer-events: none;
}
.photo .photo-label {
  position: absolute; left: 24px; bottom: 22px; z-index: 2;
  font-family: var(--sans); font-size: 11px; font-weight: 600;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--cream-80);
}
.photo img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.photo.has-img::after { border-color: rgba(255,255,255,0.5); }
.ratio-43 { aspect-ratio: 4/3; }
.ratio-11 { aspect-ratio: 1/1; }
.ratio-32 { aspect-ratio: 3/2; }
.ratio-169 { aspect-ratio: 16/9; }
.ratio-45 { aspect-ratio: 4/5; }

/* ============================================================================
   FOOTER
   ============================================================================ */
.footer { background: var(--ink); color: var(--cream); padding: clamp(56px,7vw,88px) 0 28px; }
.footer-top { display: grid; grid-template-columns: 1.3fr 1fr 2fr; gap: 48px; padding-bottom: 48px; }
.footer-logo img { height: 64px; width: auto; }
.footer-sub { margin-top: 12px; font-family: var(--sans); font-size: 10.5px; font-weight: 600; letter-spacing: 0.32em; text-transform: uppercase; color: var(--sand); }
.footer-tag { margin-top: 14px; font-size: 14px; line-height: 1.6; color: var(--cream-55); max-width: 30ch; }
.footer-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 24px; align-content: start; }
.footer-nav a { font-size: 14px; color: var(--cream-80); transition: color .18s ease; }
.footer-nav a:hover { color: var(--sand); }
.footer-offices { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 40px; }
.office h4 { font-family: var(--sans); font-size: 13px; font-weight: 700; letter-spacing: 0.06em; color: var(--sand); margin-bottom: 10px; }
.office p { font-family: var(--sans); font-size: 13.5px; line-height: 1.6; color: var(--cream-55); margin: 0; }
.footer-bottom {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding-top: 26px; border-top: 1px solid var(--cream-20); flex-wrap: wrap;
}
.footer-social { display: flex; gap: 18px; }
.footer-social a { width: 18px; height: 18px; color: var(--cream-55); transition: color .18s ease; }
.footer-social a:hover { color: var(--sand); }
.footer-legal { font-size: 12.5px; color: var(--cream-55); letter-spacing: 0.01em; }
.footer-legal a:hover { color: var(--sand); }
.footer-legal .sep { opacity: 0.4; margin: 0 8px; }

/* ============================================================================
   GENERIC GRID + CARDS
   ============================================================================ */
.grid { display: grid; gap: clamp(28px, 3vw, 44px); }
.cols-2 { grid-template-columns: repeat(2, 1fr); }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cols-4 { grid-template-columns: repeat(4, 1fr); }
.items-center { align-items: center; }

/* value / area card */
.card { background: var(--white); border: 1px solid var(--navy-12); padding: 32px; }
.card h3 { margin-bottom: 12px; }
.card .num { font-family: var(--serif); font-size: 40px; color: var(--sand); line-height: 1; }

/* breadcrumb / page indicator */
.pageno { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: 0.26em; text-transform: uppercase; color: var(--navy-40); }

/* ============================================================================
   SERVICE LANDING (página de serviço) — shared
   ============================================================================ */
.sl-hero { background: var(--navy); position: relative; overflow: hidden; padding: clamp(48px,6vw,86px) 0 clamp(56px,7vw,96px); }
.sl-hero .wm { position:absolute; right:-50px; top:50%; transform:translateY(-50%); width:clamp(320px,42vw,640px); opacity:0.07; pointer-events:none; z-index:1; }
.sl-hero .wm img { width:100%; filter:brightness(0) invert(1); }
.sl-hero .container { position:relative; z-index:2; }
.sl-card { background: var(--cream); border:1px solid var(--navy-12); padding: clamp(30px,4vw,56px); max-width: 640px; }
.sl-crumb { font-size:11px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--navy-40); margin-bottom:18px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.sl-crumb a { color:var(--navy-60); } .sl-crumb a:hover{ color:var(--navy); }
.sl-crumb .sep { color:var(--sand); }
.sl-card h1 { font-family:var(--serif); font-weight:400; font-size:clamp(28px,3.4vw,42px); line-height:1.08; margin:0 0 22px; color:var(--navy); letter-spacing:-0.005em; }
.sl-card p.body { font-size:15.5px; color:var(--navy-60); margin:0 0 1em; }
.sl-check { list-style:none; padding:0; margin:24px 0 30px; display:flex; flex-direction:column; gap:13px; }
.sl-check li { display:flex; gap:12px; align-items:flex-start; font-size:14.5px; color:var(--navy); line-height:1.45; }
.sl-check li svg { width:18px; height:18px; color:var(--sand); flex:none; margin-top:1px; }
.sl-btns { display:flex; gap:14px; flex-wrap:wrap; }

.sl-head { text-align:center; max-width:26ch; margin:0 auto 14px; }
.sl-sub { text-align:center; max-width:62ch; margin:0 auto 42px; }
.sl-center-btn { text-align:center; margin-top:42px; }

.sl-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--navy-12); border:1px solid var(--navy-12); }
.sl-cards.cols-3 { grid-template-columns:repeat(3,1fr); }
.sl-cards .c { background:var(--bone); padding:34px 24px; min-height:150px; display:flex; align-items:center; justify-content:center; text-align:center; }
.sl-cards .c p { font-family:var(--serif); font-size:18px; line-height:1.3; color:var(--navy); margin:0; }
.ground-navy .sl-cards { background:var(--cream-40); border-color:var(--cream-40); }

.sl-imp { max-width:840px; margin:0 auto; }
.sl-imp .it { padding:26px 0; border-top:1px solid var(--navy-12); }
.sl-imp .it:last-child { border-bottom:1px solid var(--navy-12); }
.sl-imp .it h3 { font-size:21px; margin:0 0 8px; display:flex; align-items:center; gap:12px; }
.sl-imp .it h3::before { content:""; width:8px; height:8px; background:var(--sand); flex:none; }
.sl-imp .it p { margin:0 0 0 20px; font-size:15.5px; color:var(--navy-60); line-height:1.65; max-width:72ch; }

.sl-pro { display:grid; grid-template-columns:300px 1fr; gap:clamp(28px,4vw,56px); max-width:940px; margin:0 auto; background:var(--white); border:1px solid var(--navy-12); }
.sl-pro .pic { background:var(--bone); min-height:340px; }
.sl-pro .pic img { width:100%; height:100%; object-fit:cover; display:block; }
.sl-pro .info { padding:clamp(28px,3vw,44px) clamp(28px,3vw,44px) clamp(28px,3vw,44px) 0; align-self:center; }
.sl-pro .info h3 { font-size:clamp(24px,2.4vw,30px); margin:0 0 8px; }
.sl-pro .info .oab { font-size:12px; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--sand); margin-bottom:18px; }
.sl-pro .info p { font-size:15px; line-height:1.65; color:var(--navy-60); margin:0 0 22px; }
.sl-pro .info .row { display:flex; align-items:center; gap:16px; }
.sl-pro .info .row a.li { width:42px; height:42px; border:1px solid var(--navy-20); display:grid; place-items:center; color:var(--navy); transition:.15s ease; }
.sl-pro .info .row a.li:hover { background:var(--navy); color:var(--cream); border-color:var(--navy); }
.sl-pro .info .row a.li svg { width:18px; height:18px; }

.faq { max-width:840px; margin:0 auto; }
.faq details { border-top:1px solid var(--navy-12); }
.faq details:last-child { border-bottom:1px solid var(--navy-12); }
.faq summary { list-style:none; cursor:pointer; padding:22px 0; display:flex; justify-content:space-between; gap:20px; align-items:center; font-size:16.5px; font-weight:500; color:var(--navy); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary .pm { width:18px; height:18px; flex:none; position:relative; }
.faq summary .pm::before, .faq summary .pm::after { content:""; position:absolute; background:var(--navy); }
.faq summary .pm::before { left:0; right:0; top:8px; height:2px; }
.faq summary .pm::after { top:0; bottom:0; left:8px; width:2px; transition:opacity .2s ease; }
.faq details[open] summary .pm::after { opacity:0; }
.faq .ans { padding:0 0 24px; font-size:15.5px; line-height:1.7; color:var(--navy-60); max-width:72ch; }

.sl-cta { position:relative; overflow:hidden; background:var(--ink); color:var(--cream); text-align:center; padding:clamp(64px,8vw,112px) 0; }
.sl-cta .bg { position:absolute; inset:0; z-index:0; }
.sl-cta .bg img { width:100%; height:100%; object-fit:cover; filter:brightness(0.32) saturate(0.8); }
.sl-cta .container { position:relative; z-index:2; }
.sl-cta .wordmark { font-family:var(--serif); font-size:20px; letter-spacing:0.02em; margin-bottom:14px; color:var(--sand); }
.sl-cta h2 { font-family:var(--serif); font-weight:400; font-size:clamp(28px,3.6vw,46px); line-height:1.15; color:var(--cream); max-width:22ch; margin:0 auto 30px; }

.sl-cta--sand .bg img { filter:none; }
.sl-cta--sand .bg::after { content:""; position:absolute; inset:0; background:rgba(234,219,185,0.82); }
.sl-cta--sand .wordmark, .sl-cta--sand h2 { color:var(--navy); }

@media (max-width: 860px){
  .sl-cards { grid-template-columns:1fr 1fr; }
  .sl-pro { grid-template-columns:1fr; }
  .sl-pro .pic { min-height:300px; }
  .sl-pro .info { padding:0 clamp(28px,5vw,40px) clamp(28px,5vw,40px); }
}
@media (max-width: 480px){ .sl-cards, .sl-cards.cols-3 { grid-template-columns:1fr; } }

/* ---- LP: photo hero card ---- */
.sl-hero--photo { background:var(--navy); }
.sl-hero--photo .bg { position:absolute; inset:0; z-index:0; }
.sl-hero--photo .bg img { width:100%; height:100%; object-fit:cover; }
.sl-hero--photo .wm { display:none; }
.tag-pill { display:inline-block; font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; padding:8px 16px; border:1px solid var(--sand); color:var(--sand); margin:0 0 20px; }
.sl-card--dark { background:var(--navy); border-color:rgba(255,255,255,0.1); }
.sl-card--dark h1 { color:var(--cream); }
.sl-card--dark p.body { color:var(--cream-80); }
.sl-card--dark .sl-check li { color:var(--cream-80); }
.sl-card--dark .sl-check li svg { color:var(--sand); }
.sl-card--dark .sl-btns .btn { background:var(--sand); color:var(--navy); border-color:var(--sand); }
.sl-card--dark .sl-btns .btn:hover { background:var(--cream); border-color:var(--cream); }
.sl-card--dark .sl-btns .btn.ghost { background:transparent; color:var(--cream); border-color:var(--cream-55); }
.sl-card--dark .sl-btns .btn.ghost:hover { background:var(--cream); color:var(--navy); }

/* ---- LP: left-bar list (desafios) ---- */
.sl-bar-list .it { border-left:3px solid var(--sand); padding-left:24px; margin-bottom:30px; }
.sl-bar-list .it:last-child { margin-bottom:0; }
.sl-bar-list .it h3 { font-family:var(--serif); font-weight:400; font-size:23px; margin:0 0 10px; color:var(--navy); }
.sl-bar-list .it p { font-size:15.5px; color:var(--navy-60); line-height:1.7; margin:0; max-width:74ch; }

/* ---- LP: left-bar grid (multi-column) ---- */
.sl-bar-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:36px 32px; }
.sl-bar-grid .it { border-left:3px solid var(--sand); padding-left:20px; }
.sl-bar-grid .it h3 { font-family:var(--serif); font-weight:400; font-size:21px; margin:0 0 10px; color:var(--navy); }
.sl-bar-grid .it p { font-size:14.5px; color:var(--navy-60); line-height:1.65; margin:0; }
@media (max-width:900px){ .sl-bar-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .sl-bar-grid{ grid-template-columns:1fr; } }

/* ---- LP: flip cards (front/back fade) ---- */
.sl-cards .c.flip { position:relative; padding:0; }
.sl-cards .c.flip .face { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:34px 24px; transition:opacity .35s ease; }
.sl-cards .c.flip .face.front { opacity:1; }
.sl-cards .c.flip .face.back { opacity:0; background:var(--navy); }
.sl-cards .c.flip .face.back p { font-family:var(--sans); font-size:14.5px; line-height:1.55; color:var(--cream); margin:0; }
.sl-cards .c.flip:hover .face.front { opacity:0; }
.sl-cards .c.flip:hover .face.back { opacity:1; }

/* ---- LP: arrow-bullet info cards ---- */
.sl-arrow-cards { display:flex; flex-direction:column; gap:20px; }
.sl-arrow-cards .c { background:var(--bone); padding:28px 30px; }
.sl-arrow-cards .c h4 { font-family:var(--serif); font-weight:400; font-size:19px; margin:0 0 16px; color:var(--navy); }
.sl-arrow-cards .c ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.sl-arrow-cards .c li { font-size:14.5px; color:var(--navy-60); line-height:1.5; display:flex; gap:10px; }
.sl-arrow-cards .c li::before { content:"→"; color:var(--sand); flex:none; font-weight:700; }

/* ---- LP: info cards (title + paragraph, static) ---- */
.sl-cards.info .c { display:block; text-align:left; padding:32px 26px; }
.sl-cards.info .c h4 { font-family:var(--serif); font-weight:400; font-size:20px; line-height:1.25; margin:0 0 12px; color:var(--navy); }
.sl-cards.info .c p { font-family:var(--sans); font-size:14.5px; line-height:1.6; color:var(--navy-60); margin:0; }

/* ---- LP: bordered cards on dark ground ---- */
.sl-cards.bordered { background:transparent; border:none; gap:20px; }
.sl-cards.bordered .c { display:block; text-align:left; background:transparent; border:1px solid var(--sand); padding:30px 26px; }
.sl-cards.bordered .c h4 { font-family:var(--serif); font-weight:400; font-size:20px; margin:0 0 14px; color:var(--cream); }
.sl-cards.bordered .c p { font-family:var(--sans); font-size:14.5px; line-height:1.6; color:var(--cream-80); margin:0; }
.sl-cards.bordered .c p strong { color:var(--cream); }

/* ---- responsive ---- */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .footer-top { grid-template-columns: 1fr; gap: 36px; }
  .footer-offices { grid-template-columns: 1fr 1fr; }
  .cols-3, .cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .cols-2, .cols-3, .cols-4 { grid-template-columns: 1fr; }
  .footer-offices { grid-template-columns: 1fr; }
  .browser-address { font-size: 11px; }
}

/* ---- whatsapp floating button ---- */
.wa-float {
  position: fixed; right: 24px; bottom: 24px; z-index: 999;
  width: 58px; height: 58px; border-radius: 50%;
  background: #25D366; display: grid; place-items: center;
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  transition: transform .2s ease, box-shadow .2s ease;
}
.wa-float:hover { transform: scale(1.07); box-shadow: 0 8px 24px rgba(0,0,0,0.32); }
.wa-float svg { width: 30px; height: 30px; color: #fff; }
@media (max-width: 600px) {
  .wa-float { right: 16px; bottom: 16px; width: 52px; height: 52px; }
  .wa-float svg { width: 27px; height: 27px; }
}