:root { --ink:#141621; --muted:#62687a; --blue:#3157e8; --blue-soft:#eef1ff; --paper:#fff; --page:#fbfbfc; --line:#e8e9ee; --shadow:0 10px 28px rgba(23, 28, 51, .06); --radius:18px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--page); color:var(--ink); font-family:Inter,system-ui,sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; } img { display:block; max-width:100%; } .container { width:min(1120px, calc(100% - 40px)); margin:auto; } .narrow { max-width:780px; }
.skip-link { position:fixed; z-index:100; top:12px; left:12px; padding:10px 14px; border-radius:8px; background:var(--ink); color:#fff; font-weight:700; text-decoration:none; transform:translateY(-160%); transition:transform .18s ease; }
.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:10; background:rgba(251,251,252,.88); border-bottom:1px solid rgba(232,233,238,.8); backdrop-filter:blur(12px); }
.header-content { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:14px; }.brand { display:inline-flex; align-items:center; gap:8px; font-weight:800; text-decoration:none; letter-spacing:-.04em; }.brand-mark { display:grid; place-items:center; width:25px; height:25px; border-radius:8px; background:var(--blue-soft); color:var(--blue); font-size:12px; font-weight:800; }.header-nav { display:none; gap:24px; }.header-nav a,.header-link { color:var(--muted); font-size:14px; font-weight:600; text-decoration:none; }.header-link { color:var(--blue); white-space:nowrap; }
.section { padding:84px 0; }.hero { padding:84px 0 76px; }.hero-content { max-width:760px; }.eyebrow { margin:0 0 17px; color:var(--blue); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.hero h1,h2,h3,p { margin-top:0; }.hero h1 { max-width:710px; margin-bottom:20px; font-size:clamp(2.45rem,10vw,5rem); line-height:1.06; letter-spacing:-.065em; }.hero h1 span { color:var(--blue); }.hero-lead { max-width:570px; margin-bottom:30px; color:var(--muted); font-size:clamp(1rem,3.6vw,1.18rem); }.button { min-height:54px; display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:14px 20px; border-radius:12px; font-size:15px; font-weight:700; text-decoration:none; transition:transform .18s ease,background .18s ease; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--blue); color:white; box-shadow:0 8px 20px rgba(49,87,232,.22); }.button-note { margin:12px 0 30px; color:var(--muted); font-size:13px; }.hero-proof { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:13px; }.proof-dot { width:9px; height:9px; border-radius:50%; background:#61c58c; box-shadow:0 0 0 4px #e8f8ef; }
h2 { margin-bottom:18px; font-size:clamp(2rem,7vw,3.3rem); line-height:1.13; letter-spacing:-.055em; }.section-copy { max-width:520px; color:var(--muted); }.question-grid { display:grid; gap:14px; margin-top:32px; }.question-card { min-height:210px; padding:25px; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }.icon-bubble { display:grid; place-items:center; width:38px; height:38px; margin-bottom:25px; border-radius:50%; background:var(--blue-soft); color:var(--blue); font-size:12px; font-weight:800; }.question-card h3 { margin-bottom:7px; font-size:18px; letter-spacing:-.04em; }.question-card p { margin:0; color:var(--muted); font-size:14px; }.subtle-section,.process-section { background:#f4f6ff; }.split-layout { display:grid; gap:36px; }.flow-card { padding:25px 20px; background:white; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }.flow-step { display:flex; align-items:center; gap:10px; padding:10px 0; font-size:14px; }.flow-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--blue-soft); color:var(--blue); font-weight:800; }.flow-arrow { display:block; margin-left:10px; color:#9ca4bd; }.flow-card p { margin:19px 0 0; padding:14px; border-radius:10px; background:#f7f8ff; font-size:13px; font-weight:600; }.services { border-bottom:1px solid var(--line); }.check-list { display:grid; gap:14px; margin:0; padding:0; list-style:none; }.check-list li { display:flex; gap:11px; align-items:flex-start; font-weight:600; }.check-list li::before { content:"✓"; display:grid; flex:0 0 21px; place-items:center; width:21px; height:21px; margin-top:2px; border-radius:50%; background:var(--blue-soft); color:var(--blue); font-size:12px; }
.work-section { background:white; }.intro-copy { margin-bottom:30px; }.work-grid { display:grid; gap:20px; }.work-card { overflow:hidden; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }.work-image { display:block; aspect-ratio:16/10; overflow:hidden; background:#f0f2f8; }.work-image img { width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .3s ease; }.work-image:hover img { transform:scale(1.03); }.work-body { padding:22px; }.work-type { margin-bottom:8px; color:var(--blue); font-size:11px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }.work-body h3 { margin-bottom:18px; font-size:20px; line-height:1.2; letter-spacing:-.045em; }.work-body dl { display:grid; gap:13px; margin:0; }.work-body dt { margin-bottom:2px; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.work-body dd { margin:0; font-size:13px; line-height:1.5; }.process-list { display:grid; gap:25px; margin:35px 0 0; padding:0; list-style:none; }.process-list li { display:flex; gap:17px; }.process-list li>span { display:grid; flex:0 0 30px; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--blue); color:#fff; font-size:13px; font-weight:800; box-shadow:0 0 0 5px var(--blue-soft); }.process-list h3 { margin:0 0 4px; font-size:16px; letter-spacing:-.025em; }.process-list p { margin:0; color:var(--muted); font-size:14px; }.final-cta { padding:88px 0; text-align:center; background:var(--ink); color:white; }.final-content { max-width:700px; }.final-cta .eyebrow { color:#aebeff; }.final-cta h2 { margin-bottom:15px; }.final-cta p:not(.eyebrow) { max-width:525px; margin:0 auto 29px; color:#d2d5e1; }.final-cta .button { background:white; color:var(--blue); }.final-cta small { display:block; margin-top:13px; color:#aeb3c4; }.site-footer { padding:42px 0; background:white; }.footer-content { display:grid; gap:15px; }.footer-content p,.footer-content small { margin:0; color:var(--muted); font-size:13px; }.footer-content>a:not(.brand) { color:var(--blue); font-size:14px; font-weight:600; text-decoration:none; }
:focus-visible { outline:3px solid #8ba0ff; outline-offset:3px; }
@media (min-width:700px) { .container { width:min(1120px, calc(100% - 64px)); }.header-nav { display:flex; }.hero { padding:120px 0 110px; }.question-grid { grid-template-columns:repeat(3,1fr); }.split-layout { grid-template-columns:1fr 1fr; align-items:start; gap:70px; }.work-grid { grid-template-columns:repeat(3,1fr); }.section { padding:112px 0; }.flow-card { padding:30px; }.footer-content { grid-template-columns:1.2fr 2fr auto; align-items:center; }.footer-content small { grid-column:1/-1; }.header-link { padding:10px 0; } }
@media (max-width:380px) { .container { width:min(100% - 32px,1120px); }.header-link { font-size:12px; }.hero h1 { font-size:2.32rem; }.button { width:100%; }.hero-proof { align-items:flex-start; } }

/* Hero: prioridade visual e área de respiro para a primeira impressão. */
.hero { display:flex; align-items:center; min-height:calc(100svh - 72px); padding:118px 0 110px; }
.hero-content { max-width:820px; }
.hero h1 { max-width:800px; margin-bottom:24px; font-size:clamp(2.95rem,12vw,6rem); line-height:1.04; letter-spacing:-.07em; }
.hero-lead { max-width:600px; margin-bottom:20px; }

@media (min-width:700px) {
  .hero { min-height:calc(100svh - 72px); padding:155px 0 145px; }
}

@media (max-width:380px) {
  .hero h1 { font-size:2.75rem; }
}

/* Cards: superfícies mais espaçosas e um acabamento discreto, premium. */
.question-grid,
.work-grid { gap:24px; }

.question-card,
.flow-card,
.work-card {
  border-radius:22px;
  border-color:rgba(27, 32, 55, .08);
  box-shadow:0 14px 36px rgba(27, 32, 55, .045);
}

.question-card { padding:32px 30px; }
.question-card .icon-bubble {
  width:48px;
  height:48px;
  margin-bottom:27px;
  border-radius:15px;
  background:linear-gradient(145deg, #f6f7ff, #e9edff);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 6px 14px rgba(49,87,232,.09);
}

.flow-card { padding:34px 30px; }
.flow-step { padding:13px 12px; border-radius:13px; }
.flow-step:nth-of-type(1),
.flow-step:nth-of-type(3) { background:#fafbff; }
.flow-icon {
  width:38px;
  height:38px;
  background:#e9edff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

.work-body { padding:29px 28px 30px; }
.work-image { border-bottom:1px solid rgba(27,32,55,.06); }
.work-card { transition:transform .22s ease, box-shadow .22s ease; }
.work-card:hover { transform:translateY(-3px); box-shadow:0 19px 42px rgba(27, 32, 55, .075); }

@media (min-width:700px) {
  .question-grid,
  .work-grid { gap:28px; }
}

/* Tipografia: títulos mais dominantes e textos de apoio mais silenciosos. */
body { line-height:1.65; }
.section { padding:100px 0; }
h2 { margin-bottom:26px; font-size:clamp(2.28rem, 7.2vw, 3.85rem); line-height:1.08; }
.section-copy { font-size:15px; line-height:1.72; }
.eyebrow { margin-bottom:21px; font-size:10px; letter-spacing:.13em; }

.question-card h3 { margin-bottom:12px; font-size:20px; line-height:1.2; }
.question-card p,
.process-list p { font-size:13px; line-height:1.7; }
.work-type { margin-bottom:11px; font-size:10px; }
.work-body h3 { margin-bottom:24px; font-size:22px; line-height:1.16; }
.work-body dl { gap:17px; }
.work-body dt { margin-bottom:4px; font-size:10px; }
.work-body dd { color:#4f5568; font-size:12px; line-height:1.65; }
.check-list { gap:18px; }
.check-list li { font-size:16px; line-height:1.55; }
.process-list { gap:31px; margin-top:42px; }
.process-list h3 { margin-bottom:8px; font-size:18px; }
.flow-card p { margin-top:24px; font-size:12px; line-height:1.65; }
.footer-content p,
.footer-content small { font-size:12px; line-height:1.65; }

@media (min-width:700px) {
  .section { padding:132px 0; }
  .work-section h2 { max-width:800px; }
}

/* Microdecisões: a leitura mostra a pergunta e o que ela provoca no visitante. */
.question-card .decision-state {
  margin:0 0 14px;
  color:var(--ink);
  font-size:13px;
  font-weight:700;
  line-height:1.4;
}
.question-card .decision-state + h3 { color:var(--blue); }

/* Fluxo de oportunidade perdida: leitura imediata em três estados. */
.flow-diagram { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:6px; }
.flow-step { display:grid; justify-items:center; gap:7px; padding:16px 4px; border-radius:14px; text-align:center; }
.flow-step:nth-of-type(1),
.flow-step:nth-of-type(3) { background:#fafbff; }
.flow-step strong { font-size:13px; letter-spacing:-.02em; }
.flow-step small { min-height:34px; color:var(--muted); font-size:10px; line-height:1.35; }
.flow-arrow { margin:0; color:#8995c8; font-size:18px; font-weight:700; }
.flow-step--exit .flow-icon { background:#f2f3f7; color:#596071; }

@media (min-width:700px) {
  .flow-diagram { gap:12px; }
  .flow-step { padding:20px 10px; }
  .flow-step strong { font-size:15px; }
  .flow-step small { font-size:11px; }
}

/* A transformação vem antes dos recursos que a tornam possível. */
.solution-content { display:grid; gap:31px; }
.check-list--outcomes { gap:17px; }
.check-list--outcomes li { font-size:18px; font-weight:700; letter-spacing:-.03em; }
.check-list--outcomes li::before { width:25px; height:25px; flex-basis:25px; background:var(--blue); color:#fff; box-shadow:0 5px 12px rgba(49,87,232,.16); }
.service-tools { padding-top:25px; border-top:1px solid var(--line); }
.service-tools p { margin:0 0 11px; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.service-tools ul { display:grid; gap:7px; margin:0; padding:0; list-style:none; color:var(--muted); font-size:13px; }
.service-tools li { display:flex; gap:8px; align-items:flex-start; }
.service-tools li::before { content:"·"; color:var(--blue); font-weight:800; }
.text-link { display:inline-flex; gap:8px; margin-top:24px; color:var(--blue); font-size:14px; font-weight:700; text-decoration:none; }
.text-link:hover { text-decoration:underline; }

/* Cases: evidenciam a transformação, sem competir com a narrativa por screenshots. */
.case-card {
  padding:30px;
  border:1px solid rgba(27,32,55,.08);
  border-radius:22px;
  background:var(--paper);
  box-shadow:0 14px 36px rgba(27,32,55,.045);
}
.case-card .work-type { margin-bottom:26px; color:var(--blue); }
.case-flow { display:grid; gap:10px; }
.case-stage { padding:17px; border-radius:14px; background:#f8f9fd; }
.case-stage>span { display:block; margin-bottom:8px; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.case-stage h3 { margin:0 0 6px; font-size:16px; letter-spacing:-.035em; }
.case-stage p { margin:0; color:#535a6e; font-size:12px; line-height:1.65; }
.case-arrow { justify-self:center; height:20px; color:#91a1dc; font-size:20px; line-height:1; }
.case-stage--result { background:var(--blue-soft); }
.case-stage--result h3 { color:var(--blue); }

/* Processo: timeline com etapas que se conectam visualmente. */
.process-list { position:relative; gap:42px; }
.process-list::before {
  content:"";
  position:absolute;
  top:32px;
  bottom:32px;
  left:39px;
  width:1px;
  background:linear-gradient(to bottom, var(--blue), #cbd4ff 88%, transparent);
}
.process-list li { position:relative; gap:25px; align-items:flex-start; }
.process-list li>span {
  position:relative;
  z-index:1;
  flex-basis:78px;
  width:78px;
  height:78px;
  border-radius:20px;
  font-size:29px;
  box-shadow:0 0 0 7px #f4f6ff, 0 10px 18px rgba(49,87,232,.16);
}
.process-list li>div { padding-top:8px; }
.process-list h3 { font-size:20px; }

@media (min-width:700px) {
  .process-list { gap:52px; }
  .process-list::before { left:47px; }
  .process-list li>span { flex-basis:94px; width:94px; height:94px; border-radius:26px; font-size:36px; }
  .process-list li>div { padding-top:13px; }
}

/* Fechamento: contraste e respiro para dar peso ao convite final. */
.final-cta { position:relative; overflow:hidden; padding:128px 0; }
.final-cta::before {
  content:"";
  position:absolute;
  top:-180px;
  left:50%;
  width:540px;
  height:540px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(70,103,255,.28), transparent 67%);
  transform:translateX(-50%);
  pointer-events:none;
}
.final-content { position:relative; max-width:790px; }
.final-cta h2 { max-width:680px; margin:0 auto 24px; font-size:clamp(2.7rem, 9vw, 5rem); line-height:1.03; }
.final-cta p:not(.eyebrow) { max-width:620px; margin-bottom:34px; font-size:clamp(1rem, 3.8vw, 1.2rem); line-height:1.65; }
.final-cta .button { min-height:60px; padding:16px 25px; font-size:16px; box-shadow:0 12px 28px rgba(0,0,0,.23); }
.cta-reassurance { display:flex; flex-direction:column; gap:7px; margin:23px 0 0; padding:0; color:#c6cbdb; list-style:none; font-size:12px; }
.cta-reassurance li::before { content:"✓"; margin-right:7px; color:#9baeff; font-weight:800; }

@media (min-width:700px) {
  .final-cta { padding:160px 0; }
  .cta-reassurance { flex-direction:row; justify-content:center; gap:22px; }
}

/* Rodapé: assinatura pessoal que conclui a narrativa da página. */
.site-footer { padding:54px 0 38px; }
.footer-content { gap:24px; }
.footer-profile { display:flex; align-items:center; gap:13px; }
.footer-profile img { width:48px; height:48px; border:2px solid var(--blue-soft); border-radius:50%; object-fit:cover; object-position:center; }
.footer-profile strong,.footer-profile span { display:block; }
.footer-profile strong { font-size:15px; letter-spacing:-.03em; }
.footer-profile span { margin-top:1px; color:var(--muted); font-size:12px; }
.footer-manifesto { max-width:390px; color:var(--ink) !important; font-size:17px !important; font-weight:600; line-height:1.45 !important; letter-spacing:-.035em; }
.footer-content small { padding-top:22px; border-top:1px solid var(--line); }

@media (min-width:700px) {
  .footer-content { grid-template-columns:1fr 1.5fr auto; gap:30px; }
  .footer-content small { grid-column:1 / -1; }
}

/* Contexto de público: pequeno sinal de reconhecimento antes do CTA. */
.hero-context { display:flex; flex-wrap:wrap; gap:8px 14px; margin:0 0 25px; padding:0; color:var(--muted); list-style:none; font-size:12px; font-weight:600; }
.hero-context li { display:flex; align-items:center; gap:6px; }
.hero-context li::before { content:"✓"; display:grid; place-items:center; width:16px; height:16px; border-radius:50%; background:var(--blue-soft); color:var(--blue); font-size:10px; font-weight:800; }

/* Ajuste fino de superfícies: menos contorno, mais ar e elevação difusa. */
.question-card,
.flow-card,
.work-card,
.case-card {
  border-color:rgba(27,32,55,.055);
  border-radius:24px;
  box-shadow:0 16px 46px rgba(27,32,55,.05);
}
.question-card { padding:36px 34px; }
.flow-card { padding:38px 34px; }
.case-card { padding:34px; }
.work-body { padding:33px 32px 34px; }
.work-card:hover { box-shadow:0 22px 52px rgba(27,32,55,.075); }

/* Estudos de caso compactos: uma única ideia por etapa, sem aparência de portfólio. */
.case-card { padding:27px; }
.case-card .work-type { margin-bottom:21px; font-size:13px; letter-spacing:-.025em; text-transform:none; }
.case-flow { gap:5px; }
.case-stage { padding:0 0 0 15px; border-radius:0; border-left:2px solid #dce2fb; background:transparent; }
.case-stage>span { margin-bottom:3px; font-size:9px; }
.case-stage h3 { display:none; }
.case-stage p { color:var(--ink); font-size:14px; font-weight:600; line-height:1.45; letter-spacing:-.02em; }
.case-arrow { justify-self:start; height:15px; margin-left:7px; color:var(--blue); font-size:16px; }
.case-stage--result { border-left-color:var(--blue); background:transparent; }
.case-stage--result p { color:var(--blue); }

/* Urgência discreta: retoma a promessa do hero antes da pergunta final. */
.cta-urgency { margin:0 0 18px; color:#aebeff; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }

/* Assinatura final mais presente, sem competir com o CTA. */
.site-footer { padding:68px 0 40px; }
.footer-profile img { width:58px; height:58px; border-width:3px; box-shadow:0 8px 20px rgba(27,32,55,.1); }
.footer-profile strong { font-size:17px; }
.footer-profile span { font-size:13px; }
.footer-manifesto { max-width:500px; font-size:20px !important; line-height:1.38 !important; }

/* Primeira Impressão Digital: etapas pequenas, objetivas e fáceis de entender. */
.evaluation-section { background:#fff; border-top:1px solid var(--line); }
.evaluation-section h2 { max-width:570px; }
.evaluation-steps { display:grid; gap:12px; margin-top:35px; }
.evaluation-steps article { min-height:155px; padding:23px; border:1px solid rgba(27,32,55,.06); border-radius:20px; background:#fbfbfd; }
.evaluation-steps article>span { display:grid; place-items:center; width:34px; height:34px; margin-bottom:19px; border-radius:11px; background:var(--blue-soft); color:var(--blue); font-size:13px; font-weight:800; }
.evaluation-steps h3 { margin:0 0 5px; font-size:17px; letter-spacing:-.035em; }
.evaluation-steps p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.evaluation-steps>i { display:none; color:#a8b4e8; font-size:22px; font-style:normal; }

@media (min-width:850px) {
  .evaluation-steps { grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:12px; }
  .evaluation-steps>i { display:block; }
  .evaluation-steps article { min-height:185px; }
}

/* Página de serviço: conteúdo específico para intenção de busca, sem repetir a home. */
.breadcrumb { margin:0 0 34px; color:var(--muted); font-size:13px; }
.breadcrumb a { color:inherit; text-decoration:none; }
.breadcrumb a:hover { color:var(--blue); text-decoration:underline; }
.breadcrumb span { margin:0 7px; }
.service-hero { display:flex; align-items:center; min-height:calc(85svh - 72px); padding:118px 0 110px; }
.service-hero-content { max-width:800px; }
.service-hero h1 { max-width:760px; margin:0 0 24px; font-size:clamp(2.7rem,11vw,5.8rem); line-height:1.04; letter-spacing:-.07em; }
.service-section h2 { max-width:630px; }
.service-copy { max-width:510px; color:var(--muted); }
.service-copy p { margin-bottom:25px; font-size:16px; line-height:1.7; }
.service-grid { display:grid; gap:16px; margin-top:38px; }
.service-card { padding:27px; border:1px solid rgba(27,32,55,.07); border-radius:20px; background:#fff; box-shadow:0 12px 34px rgba(27,32,55,.04); }
.service-card h3 { margin:0 0 9px; font-size:19px; letter-spacing:-.04em; }
.service-card p { margin:0; color:var(--muted); font-size:14px; line-height:1.65; }
.service-process { display:grid; gap:28px; margin:0; padding:0; list-style:none; }
.service-process li { display:flex; gap:17px; align-items:flex-start; }
.service-process li>span { display:grid; flex:0 0 42px; place-items:center; width:42px; height:42px; border-radius:13px; background:var(--blue); color:#fff; font-size:15px; font-weight:800; }
.service-process h3 { margin:2px 0 6px; font-size:18px; letter-spacing:-.03em; }
.service-process p { margin:0; color:var(--muted); font-size:14px; line-height:1.65; }
.service-note { border-top:1px solid var(--line); }
.service-note p:not(.eyebrow) { max-width:670px; color:var(--muted); font-size:16px; line-height:1.75; }

@media (min-width:700px) {
  .service-hero { min-height:calc(88svh - 72px); padding:150px 0; }
  .service-grid { grid-template-columns:repeat(3,1fr); gap:22px; }
  .service-card { padding:31px 28px; }
}

/* Móveis planejados: uma composição editorial que sugere projeto sem fingir ser portfólio real. */
.furniture-page { background:#f8fafc; }
.furniture-page h1,
.furniture-page h2,
.furniture-page h3 { font-family:"Manrope",Inter,sans-serif; }
.furniture-header { background:rgba(248,250,252,.88); backdrop-filter:blur(16px); }
.furniture-hero { position:relative; overflow:hidden; padding:112px 0 82px; background:linear-gradient(135deg,#f8fafc 0%,#edf7f6 58%,#e9f0ff 100%); }
.furniture-hero::before { content:""; position:absolute; inset:0; opacity:.56; background-image:linear-gradient(rgba(11,31,58,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(11,31,58,.05) 1px,transparent 1px); background-size:36px 36px; mask-image:linear-gradient(to right,black,transparent 72%); pointer-events:none; }
.furniture-hero-grid { position:relative; display:grid; gap:54px; align-items:center; }
.furniture-hero-copy { max-width:720px; }
.furniture-hero .breadcrumb { margin-bottom:29px; }
.furniture-hero .eyebrow,.furniture-section-heading .eyebrow { color:#07877f; }
.furniture-hero h1 { max-width:720px; margin:0 0 25px; color:#0b1f3a; font-size:clamp(2.75rem,11vw,5.8rem); line-height:1.03; letter-spacing:-.07em; }
.furniture-hero h1 em { color:#07877f; font-style:normal; }
.furniture-hero .hero-lead { max-width:610px; color:#475569; }
.hero-actions { display:flex; flex-wrap:wrap; gap:17px 23px; align-items:center; margin-top:31px; }
.furniture-page .button-primary { background:#0b1f3a; box-shadow:0 14px 30px rgba(11,31,58,.16); }
.furniture-page .button-primary:hover { background:#102b51; }
.furniture-text-link { color:#0b1f3a; font-size:14px; font-weight:800; text-decoration:none; }
.furniture-text-link:hover { color:#07877f; text-decoration:underline; }
.furniture-showcase { position:relative; min-height:430px; max-width:560px; margin:0 auto; padding:25px 13px 35px; }
.showcase-glow { position:absolute; top:5%; right:4%; width:76%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(20,184,166,.27),transparent 66%); filter:blur(4px); animation:furniturePulse 5.8s ease-in-out infinite; }
.showcase-browser { position:relative; z-index:1; overflow:hidden; border:1px solid rgba(11,31,58,.13); border-radius:22px; background:#fff; box-shadow:0 30px 60px rgba(11,31,58,.16); transform:rotate(2deg); }
.browser-bar { display:flex; align-items:center; gap:5px; height:37px; padding:0 14px; border-bottom:1px solid #e7edf0; background:#fcfdfd; }
.browser-bar span { width:7px; height:7px; border-radius:50%; background:#d8e1e0; }
.browser-bar i { margin-left:7px; color:#6b7c7c; font-size:8px; font-style:normal; letter-spacing:.08em; text-transform:uppercase; }
.showcase-room { position:relative; min-height:340px; overflow:hidden; background:linear-gradient(145deg,#0b1f3a 0%,#113e54 54%,#0b1f3a 100%); }
.showcase-room::before { content:""; position:absolute; right:-10%; bottom:-56%; width:80%; aspect-ratio:1; border-radius:50%; border:1px solid rgba(20,184,166,.32); box-shadow:0 0 0 52px rgba(20,184,166,.045),0 0 0 106px rgba(20,184,166,.035); }
.room-copy { position:relative; z-index:3; max-width:220px; padding:37px 28px; color:#fff; }
.room-copy small { display:block; margin-bottom:19px; color:#70e0d3; font-size:8px; font-weight:800; letter-spacing:.15em; }
.room-copy strong { display:block; font-family:"Manrope",Inter,sans-serif; font-size:clamp(1.45rem,5vw,2.2rem); line-height:1.07; letter-spacing:-.055em; }
.room-copy span { display:inline-block; margin-top:25px; padding-bottom:4px; border-bottom:1px solid #14b8a6; color:#e9ffff; font-size:11px; font-weight:700; }
.room-window { position:absolute; top:39px; right:10%; width:35%; height:39%; border:9px solid rgba(244,249,247,.92); background:linear-gradient(135deg,#cfefee,#9ed3d4); box-shadow:inset 0 0 0 1px rgba(11,31,58,.12); }
.room-window::before,.room-window::after { content:""; position:absolute; background:rgba(11,31,58,.22); }
.room-window::before { top:0; bottom:0; left:50%; width:1px; }.room-window::after { right:0; left:0; top:50%; height:1px; }
.room-cabinet { position:absolute; bottom:0; background:linear-gradient(90deg,#d9b695,#bc8f6f); box-shadow:inset -8px 0 rgba(11,31,58,.08); }
.room-cabinet-a { right:8%; width:38%; height:47%; }.room-cabinet-b { right:46%; width:21%; height:31%; background:linear-gradient(90deg,#e4c4a4,#c99a78); }
.room-cabinet::after { content:""; position:absolute; top:9%; bottom:9%; left:49%; width:1px; background:rgba(11,31,58,.3); }
.room-table { position:absolute; z-index:2; right:23%; bottom:15%; width:39%; height:12%; border-radius:50% 50% 7px 7px; background:#f3e4d2; transform:perspective(110px) rotateX(47deg); box-shadow:0 17px 0 -7px #b87f5f; }
.showcase-note { position:absolute; z-index:2; display:flex; gap:9px; align-items:flex-start; max-width:170px; padding:11px 13px; border:1px solid rgba(11,31,58,.08); border-radius:13px; background:rgba(255,255,255,.87); box-shadow:0 11px 24px rgba(11,31,58,.11); backdrop-filter:blur(8px); }
.showcase-note span { display:grid; flex:0 0 24px; place-items:center; width:24px; height:24px; border-radius:50%; background:#d8f6f2; color:#07877f; font-size:9px; font-weight:800; }.showcase-note p { margin:2px 0 0; color:#0b1f3a; font-size:10px; font-weight:800; line-height:1.3; }.showcase-note-a { top:7%; left:-4px; animation:furnitureFloat 4.8s ease-in-out infinite; }.showcase-note-b { right:-2px; bottom:14%; animation:furnitureFloat 5.4s ease-in-out -.9s infinite; }
.showcase-caption { position:absolute; right:20px; bottom:0; left:20px; margin:0; color:#64748b; font-size:10px; text-align:center; }
.furniture-intro { padding-top:94px; padding-bottom:94px; }.furniture-intro h2,.furniture-section-heading h2,.furniture-flow-copy h2,.furniture-accordion-section h2 { max-width:680px; color:#0b1f3a; }.furniture-intro-copy { max-width:535px; color:#526174; font-size:16px; line-height:1.75; }.furniture-intro-copy p { margin:0 0 17px; }
.furniture-structure { position:relative; overflow:hidden; background:#0b1f3a; color:#fff; }.furniture-structure::after { content:""; position:absolute; right:-10%; bottom:-29%; width:510px; height:510px; border:1px solid rgba(20,184,166,.3); border-radius:50%; box-shadow:0 0 0 65px rgba(20,184,166,.035),0 0 0 130px rgba(20,184,166,.024); pointer-events:none; }.furniture-section-heading { position:relative; z-index:1; max-width:710px; }.furniture-section-heading .eyebrow { color:#6ce4d6; }.furniture-section-heading h2 { color:#fff; }.furniture-section-heading>p:not(.eyebrow) { max-width:570px; margin:0; color:#c3d0df; font-size:16px; line-height:1.7; }
.furniture-steps { position:relative; z-index:1; display:grid; gap:13px; margin-top:43px; }.furniture-step { position:relative; min-height:245px; padding:25px; overflow:hidden; border:1px solid rgba(222,255,252,.15); border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.045)); transition:transform .28s ease,border-color .28s ease,background .28s ease; }.furniture-step:hover { border-color:rgba(100,237,222,.56); background:linear-gradient(145deg,rgba(20,184,166,.19),rgba(255,255,255,.06)); transform:translateY(-6px); }.furniture-step-number { color:#6ce4d6; font-size:11px; font-weight:800; letter-spacing:.11em; }.furniture-step h3 { margin:26px 0 8px; color:#fff; font-size:21px; letter-spacing:-.05em; }.furniture-step p { max-width:290px; margin:0; color:#d1dce6; font-size:13px; line-height:1.65; }.furniture-step-icon { position:absolute; right:21px; bottom:19px; width:76px; height:76px; opacity:.78; }.icon-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:5px; transform:rotate(10deg); }.icon-grid i { border:1px solid #53d7ca; border-radius:7px; }.icon-grid i:nth-child(2),.icon-grid i:nth-child(3) { background:rgba(20,184,166,.26); }.icon-path::before { content:""; position:absolute; top:8px; right:12px; bottom:8px; left:12px; border-left:1px solid #53d7ca; border-bottom:1px solid #53d7ca; transform:skewY(-29deg); }.icon-path i { position:absolute; width:12px; height:12px; border:1px solid #72ecdf; border-radius:50%; background:#0b1f3a; }.icon-path i:nth-child(1){top:7px;right:9px}.icon-path i:nth-child(2){top:31px;right:36px}.icon-path i:nth-child(3){bottom:7px;left:9px}.icon-paper { padding:9px; border:1px solid #53d7ca; border-radius:8px; transform:rotate(-8deg); }.icon-paper i { display:block; height:1px; margin:12px 0; background:#72ecdf; }.icon-paper i:nth-child(2){width:72%}.icon-chat { border:1px solid #53d7ca; border-radius:19px 19px 3px 19px; }.icon-chat i { position:absolute; top:26px; right:17px; left:17px; height:1px; background:#72ecdf; box-shadow:0 10px #72ecdf; }
.furniture-flow-section { background:#f2f8f8; }.furniture-flow-layout { display:grid; gap:44px; }.furniture-flow-copy { max-width:620px; }.furniture-flow-copy>p:not(.eyebrow) { color:#526174; font-size:16px; line-height:1.75; }.furniture-flow { position:relative; display:grid; gap:0; max-width:650px; margin:0; padding:0; list-style:none; }.furniture-flow::before { content:""; position:absolute; top:35px; bottom:35px; left:20px; width:1px; background:linear-gradient(#14b8a6,#8de5dc 80%,transparent); }.furniture-flow li { position:relative; display:flex; gap:19px; padding:0 0 28px; }.furniture-flow li:last-child { padding-bottom:0; }.furniture-flow li>span { position:relative; z-index:1; display:grid; flex:0 0 41px; place-items:center; width:41px; height:41px; border:1px solid #14b8a6; border-radius:50%; background:#f2f8f8; color:#07877f; font-size:11px; font-weight:800; }.furniture-flow strong { display:block; margin:3px 0 3px; color:#0b1f3a; font-family:"Manrope",Inter,sans-serif; font-size:17px; letter-spacing:-.04em; }.furniture-flow p { margin:0; color:#526174; font-size:13px; line-height:1.6; }
.furniture-accordion-section { background:#fff; }.furniture-accordion { margin-top:37px; border-top:1px solid #dbe6e8; }.furniture-accordion details { border-bottom:1px solid #dbe6e8; }.furniture-accordion summary { display:flex; gap:20px; justify-content:space-between; padding:22px 0; color:#0b1f3a; cursor:pointer; font-family:"Manrope",Inter,sans-serif; font-size:clamp(1rem,3.6vw,1.35rem); font-weight:700; line-height:1.35; letter-spacing:-.035em; list-style:none; }.furniture-accordion summary::-webkit-details-marker { display:none; }.furniture-accordion summary span { flex:0 0 auto; color:#07877f; font-size:24px; font-weight:400; transition:transform .25s ease; }.furniture-accordion details[open] summary span { transform:rotate(45deg); }.furniture-accordion details p { max-width:720px; margin:0; padding:0 38px 23px 0; color:#526174; font-size:15px; line-height:1.72; }
.furniture-closing { position:relative; overflow:hidden; padding:110px 0; background:radial-gradient(circle at 84% 25%,rgba(20,184,166,.28),transparent 27%),#0b1f3a; color:#fff; }.furniture-closing::before { content:""; position:absolute; top:-155px; right:-125px; width:420px; height:420px; border:1px solid rgba(255,255,255,.18); border-radius:50%; box-shadow:0 0 0 48px rgba(255,255,255,.055),0 0 0 97px rgba(255,255,255,.03); }.furniture-closing-content { position:relative; max-width:800px; }.furniture-closing .eyebrow { color:#72ecdf; }.furniture-closing h2 { max-width:760px; margin:0 0 23px; color:#fff; font-size:clamp(2.45rem,8vw,4.75rem); line-height:1.04; letter-spacing:-.07em; }.furniture-closing p:not(.eyebrow) { max-width:640px; margin-bottom:32px; color:#d1dce6; font-size:16px; line-height:1.72; }.furniture-closing .button-primary { background:#14b8a6; color:#062821; box-shadow:none; }.furniture-closing .button-primary:hover { background:#55d5c8; }
@keyframes furnitureFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } } @keyframes furniturePulse { 0%,100% { transform:scale(.94); opacity:.7; } 50% { transform:scale(1.06); opacity:1; } }
@media (prefers-reduced-motion:no-preference) { .has-reveal-motion [data-reveal] { opacity:0; transform:translateY(18px); transition:opacity .65s ease var(--reveal-delay,0ms),transform .65s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms); }.has-reveal-motion [data-reveal].is-visible { opacity:1; transform:none; } }
@media (min-width:700px) { .furniture-hero { padding:143px 0 115px; }.furniture-showcase { min-height:490px; }.furniture-steps { grid-template-columns:repeat(2,1fr); gap:17px; }.furniture-step { padding:31px; }.furniture-flow-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1fr); align-items:center; gap:9vw; }.furniture-closing { padding:143px 0; } }
@media (min-width:1040px) { .furniture-hero-grid { grid-template-columns:minmax(0,1.05fr) minmax(440px,.8fr); gap:3vw; }.furniture-showcase { margin-right:0; }.furniture-steps { grid-template-columns:repeat(4,1fr); }.furniture-step { min-height:270px; } }