:root {
  --ink: #1b1d1c;
  --ink-soft: #2f322f;
  --ivory: #f5f3ef;
  --paper: #fbfaf7;
  --stone: #d8d1c7;
  --bronze: #a88666;
  --olive: #7d6046;
  --white: #fff;
  --line: rgba(30, 33, 31, .15);
  --serif: "Manrope", "DM Sans", Arial, sans-serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  line-height: 1.6;
}
img, picture { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.site-header {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 104px;
  padding: 0 5vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.brand {
  display: inline-flex;
  align-items: center;
  opacity: .9;
}
.brand img {
  width: 182px;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.22));
}
.site-nav { display: flex; align-items: center; gap: 32px; color: rgba(255,255,255,.86); font-size: 14px; }
.site-nav a { transition: color .2s; }
.site-nav a:hover { color: var(--white); }
.nav-cta { padding: 11px 18px; border: 1px solid rgba(255,255,255,.48); letter-spacing:.04em; text-transform:uppercase; font-size:12px; }
.menu-toggle { display: none; background: none; border: 0; padding: 8px; }
.menu-toggle span { display:block; width:26px; height:1px; margin:7px; background:#fff; }

.hero { position: relative; min-height: 920px; display: flex; align-items: center; color: var(--white); overflow: hidden; }
.hero-picture, .hero-image { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-image { object-fit: cover; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg, rgba(20,20,18,.94) 0%, rgba(20,20,18,.7) 32%, rgba(20,20,18,.08) 68%); }
.hero-content { position:relative; z-index:1; width:min(760px, 62vw); margin-left:8vw; padding-top:80px; }
.eyebrow, .section-kicker { text-transform:uppercase; letter-spacing:.19em; font-size:12px; font-weight:600; }
.eyebrow { color:#d6c6b5; margin-bottom:28px; }
.hero h1 { margin:0; font-family:var(--serif); font-size:clamp(48px, 5.4vw, 82px); font-weight:500; letter-spacing:0; line-height:1.02; }
.hero h1 em { color:var(--bronze); font-style:normal; font-weight:500; }
.hero-copy { max-width:620px; margin:34px 0; color:rgba(255,255,255,.78); font-size:18px; }
.hero-actions { display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:14px 22px; font-size:13px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; transition:transform .2s, background .2s, border-color .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:rgba(255,255,255,.94); color:var(--ink); border:1px solid rgba(255,255,255,.68); }
.text-link { font-size:14px; border-bottom:1px solid rgba(255,255,255,.45); padding-bottom:4px; }
.text-link span { margin-left:8px; }
.text-link.dark { border-color:var(--line); }
.hero-note { position:absolute; z-index:1; right:5vw; bottom:42px; width:300px; display:flex; gap:18px; padding-top:20px; border-top:1px solid rgba(255,255,255,.45); font-size:13px; }
.hero-note span { color:#c5aa8d; }
.hero-note p { margin:0; color:rgba(255,255,255,.72); }

.section { padding:120px 8vw; }
.section-kicker { color:var(--bronze); margin:0 0 28px; }
.manifesto { background:var(--ivory); }
.manifesto-grid { display:grid; grid-template-columns:1.35fr .65fr; gap:10vw; align-items:start; }
.manifesto h2, .section-heading h2, .method h2, .lara h2 {
  margin:0; font-family:var(--serif); font-size:clamp(42px, 5vw, 72px); font-weight:500; letter-spacing:0; line-height:1.08;
}
.manifesto-grid > div { padding-top:14px; }
.manifesto-grid p { margin:0 0 32px; color:#5c625d; font-size:17px; }

.solutions { background:var(--paper); }
.section-heading { display:flex; justify-content:space-between; gap:8vw; align-items:end; margin-bottom:70px; }
.section-heading > p { max-width:390px; color:#6a6e69; margin:0 0 10px; }
.solution-list { border-top:1px solid var(--line); }
.solution-card { position:relative; min-height:190px; display:grid; grid-template-columns:60px 1fr 1fr 80px; gap:30px; align-items:center; border-bottom:1px solid var(--line); transition:background .25s, padding .25s; }
.solution-card:hover { background:var(--ivory); padding:0 28px; }
.solution-card > span { color:var(--bronze); font-size:13px; }
.solution-card h3 { font-family:var(--serif); font-size:34px; font-weight:500; margin:0; }
.solution-card p { color:#6a6e69; margin:0; max-width:440px; }
.card-icon { justify-self:end; width:54px; height:54px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; font-size:24px; }



.services { background:var(--paper); }
.service-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; }
.service-grid article { border:1px solid var(--line); background:var(--ivory); padding:24px; min-height:260px; display:flex; flex-direction:column; }
.service-grid span { color:var(--bronze); font-size:12px; font-weight:600; letter-spacing:.14em; }
.service-grid h3 { margin:42px 0 14px; font-family:var(--serif); font-size:30px; line-height:1.08; font-weight:500; }
.service-grid p { margin:0; color:#6a6e69; font-size:15px; }
.portfolio-filter { display:flex; gap:8px; flex-wrap:wrap; margin:-40px 0 24px; }
.portfolio-filter button { border:1px solid var(--line); background:transparent; padding:10px 14px; color:var(--ink); cursor:pointer; font-size:13px; }
.portfolio-filter button.is-active, .portfolio-filter button:hover { background:var(--ink); color:white; border-color:var(--ink); }
.portfolio-card.is-hidden { display:none; }
.portfolio-link { display:inline-block; margin-top:18px; color:var(--ink); border-bottom:1px solid var(--bronze); font-size:13px; font-weight:600; }
.briefing { background:#e8e2d8; display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; align-items:start; }
.briefing-copy h2 { margin:0; font-family:var(--serif); font-size:clamp(42px,5vw,68px); font-weight:500; line-height:1.08; }
.briefing-copy p:not(.section-kicker) { color:#606560; max-width:520px; margin:28px 0 0; }
.briefing-form { display:grid; grid-template-columns:1fr 1fr; gap:12px; background:var(--paper); padding:24px; border:1px solid var(--line); }
.briefing-form label { display:grid; gap:6px; color:#5c625d; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.briefing-form input, .briefing-form select, .briefing-form textarea { width:100%; border:1px solid var(--line); background:white; color:var(--ink); padding:12px; font:inherit; font-size:14px; text-transform:none; letter-spacing:0; }
.briefing-form textarea { resize:vertical; }
.briefing-form .full, .briefing-form button { grid-column:1/-1; }
.project-page { background:var(--paper); }
.project-hero { min-height:68vh; display:grid; grid-template-columns:.8fr 1.2fr; background:var(--ink); color:white; }
.project-hero-copy { padding:120px 8vw 80px; display:flex; flex-direction:column; justify-content:center; }
.project-hero-copy h1 { margin:0; font-family:var(--serif); font-size:clamp(48px,6vw,84px); line-height:1; font-weight:500; }
.project-hero-copy p { color:rgba(255,255,255,.72); font-size:18px; max-width:560px; }
.project-hero-media img, .project-hero-media picture { width:100%; height:100%; object-fit:cover; }
.project-detail { padding:90px 8vw; display:grid; grid-template-columns:1fr 1fr 1fr; gap:28px; }
.project-detail article { border-top:1px solid var(--line); padding-top:22px; }
.project-detail h2 { font-family:var(--serif); font-weight:500; font-size:30px; margin:0 0 12px; }
.project-detail p { color:#666b66; margin:0; }
.project-back { padding:0 8vw 90px; }
.project-back a { border-bottom:1px solid var(--bronze); }
.portfolio { background:var(--ivory); }
.portfolio-grid { display:grid; grid-template-columns:1.15fr .85fr .85fr; gap:18px; align-items:stretch; }
.portfolio-card { background:var(--paper); border:1px solid var(--line); display:flex; flex-direction:column; min-height:100%; }
.portfolio-card picture { aspect-ratio:4/3; width:100%; overflow:hidden; background:#ddd5c7; }
.portfolio-card.featured picture { aspect-ratio:16/10; }
.portfolio-card img { width:100%; height:100%; object-fit:cover; transition:transform .28s ease; }
.portfolio-card:hover img { transform:scale(1.035); }
.portfolio-card div { padding:24px; }
.portfolio-card span { display:block; color:var(--bronze); font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; margin-bottom:12px; }
.portfolio-card h3 { margin:0; font-family:var(--serif); font-size:clamp(26px,2.7vw,38px); line-height:1.08; font-weight:500; }
.portfolio-card p { margin:16px 0 0; color:#6a6e69; font-size:15px; }
.portfolio-cta { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:22px; align-items:center; }
.portfolio-cta p { margin:0; color:#5c625d; font-size:17px; }
.button-dark { background:var(--ink); color:white; border:1px solid var(--ink); }
.method { display:grid; grid-template-columns:1.08fr .92fr; padding:0; background:var(--ivory); }
.method-media { position:relative; min-height:860px; overflow:hidden; }
.method-media picture, .method-media img { width:100%; height:100%; }
.method-media img { object-fit:cover; }
.media-label { position:absolute; left:30px; bottom:30px; padding:12px 16px; background:rgba(251,250,246,.92); font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.method-content { padding:110px 8vw 90px 7vw; }
.method h2 { font-size:clamp(42px,4.4vw,68px); }
.steps { list-style:none; margin:60px 0 0; padding:0; border-top:1px solid var(--line); }
.steps li { display:grid; grid-template-columns:50px 1fr; gap:20px; padding:24px 0; border-bottom:1px solid var(--line); }
.steps li > span { color:var(--bronze); font-size:12px; }
.steps strong { font-size:18px; }
.steps p { margin:5px 0 0; color:#6a6e69; font-size:14px; }

.result { padding:0; display:grid; grid-template-columns:.85fr 1.15fr; min-height:720px; background:var(--ink); color:var(--white); }
.result-copy { display:flex; flex-direction:column; justify-content:center; padding:90px 7vw; }
.section-kicker.light { color:#c7b49f; }
.result blockquote { margin:20px 0 70px; font-family:var(--serif); font-size:clamp(38px,4vw,61px); line-height:1.12; font-weight:500; }
.result-media picture, .result-media img { width:100%; height:100%; }
.result-media img { object-fit:cover; }
.result-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; padding-top:26px; border-top:1px solid rgba(255,255,255,.2); }
.result-stats strong { display:block; font-family:var(--serif); color:#c7b49f; font-size:32px; font-weight:500; }
.result-stats span { color:rgba(255,255,255,.55); font-size:12px; }

.confidence { background:var(--paper); }
.confidence-grid { display:grid; grid-template-columns:repeat(3, 1fr); border-top:1px solid var(--line); }
.confidence-grid article { padding:34px 36px 10px 0; border-right:1px solid var(--line); }
.confidence-grid article + article { padding-left:36px; }
.confidence-grid article:last-child { border-right:0; }
.confidence-grid strong { font-family:var(--serif); font-size:27px; font-weight:500; }
.confidence-grid p { color:#6a6e69; margin:14px 0 0; }

.faq { display:grid; grid-template-columns:.75fr 1.25fr; gap:10vw; background:var(--ivory); }
.faq-intro h2 { margin:0; font-family:var(--serif); font-size:clamp(42px,5vw,70px); font-weight:500; line-height:1.08; }
.faq-intro > p:last-child { color:#6a6e69; max-width:420px; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); padding:24px 0; }
.faq-list summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:20px; font-size:18px; font-weight:600; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:"+"; color:var(--bronze); font-size:24px; font-weight:400; }
.faq-list details[open] summary::after { content:"−"; }
.faq-list p { color:#6a6e69; margin:16px 50px 0 0; }

.lara { background:#e8e2d8; display:grid; grid-template-columns:1fr .8fr; gap:10vw; align-items:center; }
.lara-intro > p:not(.section-kicker) { color:#606560; max-width:580px; margin:28px 0; font-size:17px; }
.lara-availability { display:flex; align-items:center; gap:10px; font-size:13px; }
.lara-availability i, .chat-header > i { width:8px; height:8px; border-radius:50%; background:var(--bronze); box-shadow:0 0 0 4px rgba(168,134,102,.13); }
.chat-card { background:var(--paper); padding:26px; box-shadow:0 28px 70px rgba(27,29,28,.12); border:1px solid var(--line); }
.chat-header { display:flex; align-items:center; gap:13px; padding-bottom:22px; border-bottom:1px solid var(--line); }
.lara-avatar { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; color:white; background:var(--ink); font-family:var(--serif); font-size:18px; }
.chat-header div:nth-child(2) { display:grid; flex:1; }
.chat-header span { color:#777b76; font-size:12px; }
.chat-body { padding:28px 0; }
.message { max-width:88%; padding:14px 17px; border-radius:3px; background:#eeebe5; font-size:14px; }
.quick-options { margin-top:22px; display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.quick-options button { text-align:left; padding:12px; border:1px solid var(--line); background:transparent; color:#4e534e; font-size:12px; cursor:pointer; border-radius:0; }
.quick-options button:hover { border-color:var(--bronze); color:var(--bronze); }
.button-chat { width:100%; justify-content:space-between; background:var(--ink); color:white; }
.chat-card small { display:block; margin-top:13px; color:#8a8d88; font-size:10px; text-align:center; }

.floating-contact { position:fixed; z-index:20; right:22px; bottom:22px; display:flex; flex-direction:column; align-items:flex-end; gap:8px; transition:opacity .2s, transform .2s, visibility .2s; }
.floating-contact.is-hidden { opacity:0; visibility:hidden; pointer-events:none; transform:translateY(12px); }
.floating-contact a { min-height:42px; padding:11px 15px; display:flex; align-items:center; gap:9px; color:white; font-size:12px; font-weight:600; box-shadow:0 10px 30px rgba(0,0,0,.18); transition:transform .2s; }
.floating-contact a:hover { transform:translateY(-2px); }
.floating-icon { width:22px; text-align:center; font-size:10px; letter-spacing:.05em; }
.floating-instagram { background:var(--ink); }
.floating-whatsapp { background:var(--bronze); }

.site-footer { background:#171917; color:white; padding:70px 8vw 28px; display:grid; grid-template-columns:220px 1fr auto; gap:50px; align-items:start; }
.site-footer img { width:210px; }
.site-footer p { margin:8px 0; color:rgba(255,255,255,.6); }
.site-footer > div { display:grid; text-align:right; gap:8px; font-size:13px; }
.site-footer small { grid-column:1/-1; padding-top:28px; border-top:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.4); }

.legal-page { background:var(--ivory); }
.legal-header { min-height:100px; padding:20px 8vw; display:flex; align-items:center; justify-content:space-between; background:var(--ink); color:white; }
.legal-header img { width:190px; }
.legal-header > a:last-child { font-size:13px; border-bottom:1px solid rgba(255,255,255,.4); }
.legal-content { max-width:900px; margin:0 auto; padding:100px 6vw 120px; }
.legal-content h1 { margin:0 0 30px; font-family:var(--serif); font-size:clamp(48px,6vw,76px); font-weight:500; line-height:1; }
.legal-content h2 { margin:42px 0 8px; font-family:var(--serif); font-size:27px; font-weight:500; }
.legal-content p { color:#565c57; font-size:16px; }
.legal-content a { border-bottom:1px solid var(--bronze); }
.legal-update { margin-top:60px; font-size:13px !important; }

@media (max-width: 950px) {
  .site-header { height:82px; }
  .brand img { width:150px; }
  .menu-toggle { display:block; z-index:2; }
  .site-nav { display:none; position:absolute; top:82px; left:0; width:100%; padding:28px 5vw; background:#1d201e; flex-direction:column; align-items:flex-start; }
  .site-nav.open { display:flex; }
  .hero { min-height:820px; }
  .hero-content { width:84vw; }
  .hero-note { display:none; }
  .manifesto-grid, .method, .result, .lara, .faq { grid-template-columns:1fr; }
  .portfolio-grid, .service-grid, .briefing, .project-hero, .project-detail { grid-template-columns:1fr; }
  .portfolio-cta { align-items:flex-start; flex-direction:column; }
  .briefing-form { grid-template-columns:1fr; }
  .project-hero-copy { padding:100px 6vw 70px; }
  .section-heading { align-items:start; flex-direction:column; }
  .solution-card { grid-template-columns:45px 1fr 60px; padding:24px 0; }
  .solution-card p { grid-column:2/4; }
  .method-media { min-height:540px; }
  .result-media { min-height:520px; order:-1; }
  .confidence-grid { grid-template-columns:1fr; }
  .confidence-grid article, .confidence-grid article + article { padding:28px 0; border-right:0; border-bottom:1px solid var(--line); }
  .site-footer { grid-template-columns:1fr; }
  .site-footer > div { text-align:left; }
}

@media (max-width: 600px) {
  .section { padding:82px 6vw; }
  .hero { min-height:760px; }
  .hero-shade { background:linear-gradient(90deg, rgba(20,20,18,.88), rgba(20,20,18,.35)); }
  .hero-content { margin-left:6vw; width:88vw; }
  .hero h1 { font-size:48px; }
  .hero-copy { font-size:16px; }
  .solution-card { grid-template-columns:36px 1fr 48px; }
  .solution-card h3 { font-size:27px; }
  .method-content { padding:80px 6vw; }
  .result-copy { padding:80px 6vw; }
  .result-stats { grid-template-columns:1fr; }
  .quick-options { grid-template-columns:1fr; }
  .floating-contact { right:12px; bottom:12px; gap:9px; }
  .floating-contact a { width:48px; height:48px; min-height:48px; padding:0; justify-content:center; border-radius:50%; }
  .floating-contact .floating-icon { width:auto; font-size:11px; }
  .floating-contact .floating-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .site-footer { padding:60px 6vw 24px; }
}
