/* ==========================================================================
   F.S. Limpezas · Viseu e arredores
   Identidade tirada dos flyers da cliente: pinceladas, selos redondos,
   polaroids com legenda manuscrita, swoosh do logótipo, faixa diagonal
   de fim de obra e pilha de fotos da limpeza mensal.
   ========================================================================== */

/* ---------- Fontes (self-hosted, subconjunto latino) ---------- */
@font-face {
  font-family: "Poppins";
  src: url("../assets/fonts/poppins-600-latin.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-latin.woff2") format("woff2");
  font-weight: 400 600; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* letra manuscrita dos flyers: só em frases de apoio, nunca nos títulos */
@font-face {
  font-family: "Caveat";
  src: url("../assets/fonts/caveat-latin.woff2") format("woff2");
  font-weight: 400 700; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* derivadas do logótipo: texto azul-marinho, prédios azuis, casa verde, janela laranja */
  --navy: #0A2E5C;
  --navy-2: #0E3D78;
  --navy-deep: #071F40;
  --blue: #0563AE;          /* botões: AA com branco */
  --blue-h: #044E8A;
  --sky: #1C9BDB;
  --sky-lt: #6CC4F0;
  --sky-ink: #0B76B0;       /* azul-céu legível sobre branco */
  --green: #3F8A1F;
  --green-hi: #7AB33A;
  --sun: #F3AA1D;
  --sun-h: #E59A0C;
  --wa: #0F7F43;
  --tint: #E6F1FA;
  --tint-2: #F3F8FC;
  --bg: #FFFFFF;
  --white: #FFFFFF;
  --text: #0E1B2A;
  --muted: #51647A;
  --on-navy: rgba(255, 255, 255, .8);
  --line: #DAE6F0;
  --error: #B42318;

  --font-display: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-script: "Caveat", "Segoe Script", cursive;

  --s-0: 1.0625rem;
  --s-1: 1.1875rem;
  --s-2: clamp(1.375rem, 1.2rem + .8vw, 1.75rem);
  --s-3: clamp(1.75rem, 1.3rem + 1.9vw, 2.75rem);

  --gutter: 1rem;
  --band: clamp(4rem, 2.8rem + 5vw, 7.5rem);
  --r-sm: 12px;
  --r: 18px;
  --r-lg: 26px;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --shadow: 0 1px 0 var(--line), 0 20px 40px -28px rgba(10, 46, 92, .45);
  --shadow-lg: 0 30px 70px -36px rgba(10, 46, 92, .55);
}
@media (min-width: 640px) { :root { --gutter: 2rem; } }

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
html { overflow-x: clip; scroll-padding-top: 96px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: var(--font-body); font-size: var(--s-0); line-height: 1.6;
  -webkit-font-smoothing: antialiased; overflow-x: clip;
}
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, ul, ol, figure { margin: 0; }
:where(ul[role="list"], ol[role="list"]) { list-style: none; padding: 0; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; letter-spacing: -.02em; text-wrap: balance; }
h2 { font-size: var(--s-3); line-height: 1.15; }
h3 { font-size: var(--s-2); line-height: 1.25; }
p, li { text-wrap: pretty; }

.wrap { width: 100%; max-width: 1180px; margin-inline: auto; padding-inline: var(--gutter); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 1rem; top: -100%; z-index: 100; padding: .7rem 1.1rem; border-radius: var(--r-sm); background: var(--navy); color: var(--white); text-decoration: none; }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 3px solid var(--sky); outline-offset: 3px; border-radius: 6px; }
.ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.script { font-family: var(--font-script); font-weight: 700; line-height: 1.05; letter-spacing: 0; }

/* pincelada por trás de uma palavra ou etiqueta */
.brush-bg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; overflow: visible; }

/* ---------- Hover gelatinoso ---------- */
@keyframes jelly {
  0% { transform: scale(1, 1); } 30% { transform: scale(1.07, .93); } 50% { transform: scale(.96, 1.04); }
  70% { transform: scale(1.02, .98); } 100% { transform: scale(1, 1); }
}
@keyframes flutua { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  padding: .85rem 1.45rem; border: 1.5px solid transparent; border-radius: 999px;
  font-weight: 600; font-size: var(--s-0); line-height: 1.2; text-decoration: none; cursor: pointer;
  transition: background-color .25s, color .25s, border-color .25s, box-shadow .25s;
}
.btn .ico { width: 18px; height: 18px; }
.btn-primary { background: var(--blue); color: var(--white); box-shadow: 0 14px 28px -16px rgba(5, 99, 174, .85); }
.btn-primary:hover { background: var(--blue-h); }
.btn-wa { background: var(--wa); color: var(--white); box-shadow: 0 14px 28px -16px rgba(15, 127, 67, .85); }
.btn-wa:hover { background: #0B6A37; }
.btn-sun { background: var(--sun); color: var(--navy-deep); box-shadow: 0 14px 28px -14px rgba(243, 170, 29, .7); }
.btn-sun:hover { background: var(--sun-h); }
.btn-line { border-color: var(--line); background: var(--white); color: var(--navy); }
.btn-line:hover { border-color: var(--navy); }
.btn-line .ico-wa { color: var(--wa); }
.btn-line-light { border-color: rgba(255, 255, 255, .45); color: var(--white); }
.btn-line-light:hover { background: rgba(255, 255, 255, .12); border-color: var(--white); }
.btn-lg { padding: 1.05rem 2rem; }
.btn-sm { padding: .62rem 1.1rem; font-size: .9375rem; }
.btn-block { width: 100%; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .btn:hover { animation: jelly .6s var(--ease); } }
.cta-row { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: clamp(2.5rem, 4.5vw, 3.5rem); justify-content: center; }
.actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2rem; }

/* ---------- Pílula ---------- */
.pill {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .4rem .95rem; border-radius: 999px;
  background: var(--tint); color: var(--navy);
  font-size: .8125rem; font-weight: 600; letter-spacing: .01em;
}
.pill--sun { background: var(--sun); color: var(--navy-deep); }

/* ---------- Traço curvo animado ---------- */
.mark { position: relative; display: inline-block; white-space: nowrap; }
.mark-line { position: absolute; left: -2%; bottom: -.2em; width: 104%; height: .34em; overflow: visible; pointer-events: none; fill: none; stroke: var(--sky); stroke-width: 4px; stroke-linecap: round; }
.mark-line path { vector-effect: non-scaling-stroke; stroke-dasharray: 100; stroke-dashoffset: 0; }
@media (prefers-reduced-motion: no-preference) {
  .js .mark-line path { stroke-dashoffset: 100; }
  .js .mark.is-drawn .mark-line path { stroke-dashoffset: 0; transition: stroke-dashoffset 1.1s var(--ease) .25s; }
}

/* ---------- Brilhos flutuantes (só nas margens vazias) ---------- */
.sparkles { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.sparkle { position: absolute; color: var(--sky); opacity: 0; }
.sparkle svg { width: 100%; height: 100%; fill: currentColor; }
.sparkles.is-on .sparkle { opacity: var(--o, .5); }
@media (prefers-reduced-motion: no-preference) {
  .sparkle { transition: opacity 1s var(--ease); animation: twinkle var(--t, 5s) ease-in-out var(--dl, 0s) infinite alternate; }
}
@keyframes twinkle {
  0% { transform: translate3d(0, 0, 0) scale(.85) rotate(0deg); }
  100% { transform: translate3d(var(--dx, 8px), var(--dy, -16px), 0) scale(1.1) rotate(14deg); }
}
@media (max-width: 1279px) { .sparkles { display: none; } }

.tick-badge {
  position: absolute; display: grid; place-items: center;
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--green-hi); color: var(--white);
  box-shadow: 0 0 0 4px var(--white), 0 10px 20px -8px rgba(10, 46, 92, .5);
}
.tick-badge .ico { width: 22px; height: 22px; stroke-width: 3; }

.doodle-heart { position: absolute; width: 44px; fill: none; stroke: var(--sky); stroke-width: 3; stroke-linejoin: round; pointer-events: none; }

/* ==========================================================================
   Faixa de contactos + cabeçalho
   ========================================================================== */
.topbar { background: var(--navy-deep); color: var(--on-navy); font-size: .8125rem; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 38px; }
.topbar p { display: flex; align-items: center; gap: .45rem; }
.topbar .ico { width: 15px; height: 15px; color: var(--sky-lt); }
.tb-sep { color: var(--sun); font-size: .7rem; }
.tb-phones { gap: 1.25rem !important; }
.tb-phones a { padding-block: .25rem; display: inline-flex; align-items: center; gap: .4rem; color: var(--white); font-weight: 600; text-decoration: none; }
.tb-phones a:hover { text-decoration: underline; text-underline-offset: .25em; }
@media (max-width: 639px) {
  .topbar-inner > p:first-child { display: none; }
  .topbar-inner { justify-content: center; }
}

.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, .97); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
  transition: box-shadow .3s;
}
.site-header.is-stuck { box-shadow: 0 16px 34px -26px rgba(7, 31, 64, .55); }
.header-inner { display: flex; align-items: center; gap: 1.25rem; min-height: 78px; }
.brand { display: flex; margin-right: auto; }
.brand img { width: 176px; height: auto; }
@media (min-width: 1280px) { .brand img { width: 196px; } }
.nav ul { display: flex; gap: clamp(1rem, 2.2vw, 2.1rem); list-style: none; margin: 0; padding: 0; }
.nav a { position: relative; z-index: 0; display: block; padding: .35rem 0; text-decoration: none; font-weight: 500; color: var(--navy); white-space: nowrap; }
/* marcador amarelo ao passar, como uma pincelada fina */
.nav a::after {
  content: ""; position: absolute; left: -4px; right: -4px; bottom: 2px; height: 8px; border-radius: 6px;
  background: var(--sun); opacity: .55; z-index: -1; transform: scaleX(0); transform-origin: left;
  transition: transform .3s var(--ease);
}
.nav a:hover::after, .nav a[aria-current="true"]::after { transform: scaleX(1); }
.header-cta { display: none; }
@media (min-width: 1024px) { .header-cta { display: inline-flex; } .nav { margin-right: 1rem; } }
@media (max-width: 1023px) {
  .nav {
    position: absolute; left: var(--gutter); right: var(--gutter); top: calc(100% + 8px);
    background: var(--white); border-radius: var(--r-lg); padding: .5rem 1.25rem 1rem;
    transform: translateY(-10px); opacity: 0; visibility: hidden;
    transition: opacity .25s, transform .25s var(--ease), visibility .25s; box-shadow: var(--shadow-lg);
  }
  .nav.is-open { opacity: 1; transform: none; visibility: visible; }
  .nav ul { flex-direction: column; gap: 0; }
  .nav a { padding: .85rem 0; border-bottom: 1px solid var(--line); }
  .nav a::after { display: none; }
  .nav li:last-child a { border-bottom: 0; }
}
.menu-toggle { display: grid; place-items: center; width: 46px; height: 46px; border: 0; border-radius: 14px; background: var(--navy); color: var(--white); cursor: pointer; }
@media (min-width: 1024px) { .menu-toggle { display: none; } }
.menu-toggle .ico-close, .menu-toggle[aria-expanded="true"] .ico-open { display: none; }
.menu-toggle[aria-expanded="true"] .ico-close { display: block; }

/* ==========================================================================
   01 — Hero claro: foto em forma orgânica + swoosh do logótipo
   ========================================================================== */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  background:
    radial-gradient(60% 70% at 85% 35%, rgba(28, 155, 219, .16), transparent 70%),
    radial-gradient(40% 50% at 5% 90%, rgba(122, 179, 58, .10), transparent 70%),
    linear-gradient(180deg, #fff 0%, var(--tint-2) 100%);
  padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(6rem, 11vw, 10rem);
}
.hero-grid { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 900px) { .hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(2rem, 4vw, 4rem); } }

.hero-script { color: var(--sky-ink); font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); transform: rotate(-2deg); transform-origin: left; }
.hero h1 { margin-top: .9rem; font-size: clamp(2.6rem, 1.5rem + 4vw, 4.6rem); line-height: 1.08; color: var(--navy); }
.brushed { position: relative; isolation: isolate; display: inline-block; white-space: nowrap; padding: .02em .32em .08em .22em; margin-left: -.12em; }
.brushed .brush-bg { fill: var(--sun); }
.brushed > span { position: relative; }
@media (prefers-reduced-motion: no-preference) {
  .js .brushed .brush-bg { clip-path: inset(0 100% 0 0); }
  .js .hero.is-ready .brushed .brush-bg { clip-path: inset(0 0 0 0); transition: clip-path .9s var(--ease) .6s; }
}
.hero-lead { margin-top: 1.4rem; max-width: 33rem; color: var(--muted); font-size: var(--s-1); line-height: 1.6; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2rem; }
.hero-phones { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; margin-top: 1.75rem; }
.hero-phones a { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; color: var(--navy); text-decoration: none; }
.hero-phones a:hover { color: var(--blue); }
.hp-ico { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--blue); color: var(--white); }
.hp-ico .ico { width: 18px; height: 18px; }
.hero-note { margin-top: .6rem; font-size: .75rem; color: var(--muted); }

.hero-art { position: relative; width: 100%; max-width: 560px; aspect-ratio: 1; margin-inline: auto; }
.hero-blob {
  position: absolute; inset: 5% 5% 11% 9%; overflow: hidden;
  border-radius: 62% 38% 54% 46% / 48% 56% 44% 52%;
  box-shadow: 0 40px 80px -40px rgba(10, 46, 92, .6);
  background: var(--tint);
}
.hero-blob picture { display: block; width: 100%; height: 100%; }
.hero-blob img { width: 100%; height: 100%; object-fit: cover; }
@media (prefers-reduced-motion: no-preference) { .hero-blob { animation: morph 16s ease-in-out infinite alternate; } }
@keyframes morph {
  0% { border-radius: 62% 38% 54% 46% / 48% 56% 44% 52%; }
  50% { border-radius: 46% 54% 40% 60% / 58% 42% 58% 42%; }
  100% { border-radius: 56% 44% 62% 38% / 44% 60% 40% 56%; }
}
.swoosh { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.swoosh--back { fill: var(--sky); opacity: .85; transform: translate(-3%, 5%) rotate(-6deg); }
.swoosh--front { fill: var(--blue); transform: translate(-1%, 6%) rotate(-4deg); }
.hero-spark { position: absolute; color: var(--sky); pointer-events: none; }
.hero-spark svg { width: 100%; height: 100%; fill: currentColor; }
.hero-spark--a { width: 44px; height: 44px; right: 6%; top: 0; }
.hero-spark--b { width: 24px; height: 24px; right: 0; top: 11%; color: var(--green-hi); }
.hero-spark--c { width: 18px; height: 18px; right: 14%; top: 13%; }
@media (prefers-reduced-motion: no-preference) {
  .hero-spark--a { animation: twinkle 4.5s ease-in-out infinite alternate; }
  .hero-spark--b { animation: twinkle 3.6s ease-in-out .8s infinite alternate; }
  .hero-spark--c { animation: twinkle 4s ease-in-out 1.4s infinite alternate; }
}

.seal {
  position: absolute; left: -3%; top: 6%;
  width: 136px; height: 136px; border-radius: 50%;
  background: var(--white); box-shadow: 0 20px 40px -20px rgba(10, 46, 92, .55);
}
.seal-ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.seal-ring text { font-family: var(--font-display); font-weight: 600; font-size: 13.4px; letter-spacing: 2.2px; fill: var(--navy); }
@media (prefers-reduced-motion: no-preference) { .seal-ring { animation: gira 24s linear infinite; } }
@keyframes gira { to { transform: rotate(360deg); } }
.seal-core {
  position: absolute; inset: 26%; border-radius: 50%;
  display: grid; place-content: center; justify-items: center;
  background: var(--navy); color: var(--white); text-align: center;
}
.seal-core .ico { width: 18px; height: 18px; color: var(--sun); }
.seal-core strong { font-family: var(--font-display); font-size: .9rem; line-height: 1.1; }

.brush-price {
  position: absolute; right: -2%; bottom: 7%; isolation: isolate;
  display: grid; justify-items: center;
  padding: 1rem 1.9rem 1.15rem; color: var(--white); text-decoration: none;
  transform: rotate(-4deg);
}
.brush-price .brush-bg { fill: var(--navy); filter: drop-shadow(0 14px 18px rgba(7, 31, 64, .35)); }
.bp-label { font-size: .75rem; font-weight: 600; opacity: .9; }
.bp-value { display: flex; align-items: baseline; gap: .2rem; font-family: var(--font-display); font-weight: 600; }
.bp-value strong { font-size: 2.5rem; line-height: 1; color: var(--sun); letter-spacing: -.03em; }
.bp-value span { font-size: 1rem; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .brush-price:hover { animation: jelly .6s var(--ease); } }

.hero-wave { position: absolute; left: 0; bottom: -1px; width: 100%; height: clamp(60px, 8vw, 120px); }
.hw-light { fill: var(--sky); opacity: .28; }
.hw-navy { fill: var(--navy); }

@media (max-width: 899px) {
  .hero { text-align: center; padding-top: 1.5rem; }
  .hero-art { order: -1; max-width: 420px; }
  .hero-script { transform-origin: center; }
  .hero-lead { margin-inline: auto; font-size: var(--s-0); }
  .hero-actions, .hero-phones { justify-content: center; }
  .seal { width: 104px; height: 104px; left: 0; top: 2%; }
  .seal-core strong { font-size: .75rem; }
  .brush-price { right: 0; bottom: 4%; padding: .8rem 1.5rem .9rem; }
  .bp-value strong { font-size: 2rem; }
}

/* ==========================================================================
   02 — Benefícios (faixa azul-marinho) + fita de serviços
   ========================================================================== */
.benefits { position: relative; background: var(--navy); color: var(--white); padding: .5rem 0 3.25rem; margin-top: -1px; }
.benefit-grid { display: grid; gap: 1.5rem 1rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 1000px) { .benefit-grid { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; } }
.benefit { display: flex; align-items: center; gap: .9rem; }
.benefit-ico {
  flex: 0 0 auto; display: grid; place-items: center;
  width: 54px; height: 54px; border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .07); color: var(--sky-lt);
}
.benefit:nth-child(2) .benefit-ico { color: var(--sun); }
.benefit:nth-child(3) .benefit-ico { color: #A9D86E; }
.benefit-ico .ico { width: 24px; height: 24px; }
.benefit h3 { font-size: 1rem; line-height: 1.3; color: var(--white); }
.benefit p { margin-top: .15rem; color: var(--on-navy); font-size: .8438rem; line-height: 1.45; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .benefit:hover .benefit-ico { animation: jelly .6s var(--ease); } }
@media (max-width: 599px) {
  .benefit { flex-direction: column; text-align: center; gap: .6rem; }
  .benefit p { display: none; }
  .benefit h3 { font-size: .875rem; }
}

.ribbon {
  position: relative; z-index: 4; overflow: hidden;
  width: 106%; margin: -1.4rem -3% 0; padding: .8rem 0;
  background: var(--sun); color: var(--navy-deep);
  transform: rotate(-1.8deg);
  box-shadow: 0 16px 30px -18px rgba(7, 31, 64, .5);
}
.ribbon-track { display: flex; align-items: center; gap: 1.4rem; width: max-content; padding-left: 1.4rem; }
.ribbon span { font-family: var(--font-display); font-weight: 600; font-size: 1.0625rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.ribbon i { font-style: normal; color: var(--white); font-size: .9rem; }
@media (prefers-reduced-motion: no-preference) { .ribbon-track { animation: ticker 45s linear infinite; } }
@keyframes ticker { to { transform: translateX(-50%); } }

/* ==========================================================================
   Dobras e cabeçalhos de secção
   ========================================================================== */
.band { position: relative; padding: var(--band) 0; }
.band--tint { background: var(--tint-2); }
.band > .wrap { position: relative; z-index: 2; }
.head { max-width: 62rem; }
.head--center { margin-inline: auto; text-align: center; }
.head h2 { margin-top: 1.1rem; color: var(--navy); }
.head p { max-width: 42rem; margin: 1.1rem auto 0; color: var(--muted); font-size: var(--s-1); line-height: 1.55; }

/* ==========================================================================
   03 — Sobre nós: polaroids
   ========================================================================== */
.band--about { padding-top: calc(var(--band) + 1rem); }
.about { display: grid; gap: 3.5rem; align-items: center; }
@media (min-width: 900px) { .about { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(3rem, 6vw, 5.5rem); } }

.polaroids { position: relative; width: 100%; max-width: 540px; height: clamp(420px, 48vw, 580px); margin-inline: auto; }
.polaroid {
  position: absolute; padding: 12px 12px 58px; background: var(--white); border-radius: 6px;
  box-shadow: 0 30px 60px -30px rgba(10, 46, 92, .55), 0 2px 6px rgba(10, 46, 92, .08);
  transition: transform .45s var(--ease);
}
.polaroid img { width: 100%; height: auto; object-fit: cover; border-radius: 3px; }
.polaroid figcaption { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; font-size: 1.7rem; color: var(--navy); }
.polaroid .tick-badge { top: -16px; right: -16px; }
.polaroid--a { width: 56%; left: 2%; top: 0; transform: rotate(-5deg); z-index: 1; }
.polaroid--a img { aspect-ratio: 700 / 820; }
.polaroid--b { width: 45%; right: 0; bottom: 0; transform: rotate(6deg); z-index: 2; }
.polaroid--b img { aspect-ratio: 1; }
.polaroids .doodle-heart { left: 8%; bottom: 8%; transform: rotate(-12deg); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .polaroid:hover { transform: rotate(0deg) translateY(-6px); z-index: 3; }
}
@media (prefers-reduced-motion: no-preference) { .polaroids .doodle-heart { animation: flutua 4s ease-in-out infinite; } }

.about-copy h2 { color: var(--navy); margin-top: 1rem; }
.about-copy > p { margin-top: 1.2rem; color: var(--muted); line-height: 1.65; }
.about-cards { margin-top: 1.75rem; display: grid; gap: .75rem; }
@media (min-width: 560px) { .about-cards { grid-template-columns: repeat(3, 1fr); } }
.about-cards li { display: grid; gap: .15rem; padding: 1.1rem 1rem; background: var(--tint-2); border-radius: 20px; }
.about-cards strong { margin-top: .55rem; font-family: var(--font-display); color: var(--navy); font-size: 1rem; }
.about-cards li > span:last-child { color: var(--muted); font-size: .8438rem; line-height: 1.4; }
.ac-ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--navy); color: var(--white); }
.about-cards li:nth-child(2) .ac-ico { background: var(--green-hi); }
.about-cards li:nth-child(3) .ac-ico { background: var(--sun); color: var(--navy-deep); }
.ac-ico .ico { width: 19px; height: 19px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .about-cards li:hover .ac-ico { animation: jelly .6s var(--ease); } }
.about-script { margin-top: 1.6rem; color: var(--green); font-size: 2rem; transform: rotate(-2deg); transform-origin: left; }

/* ==========================================================================
   04 — Serviços: lista (como no flyer) + pré-visualização
   ========================================================================== */
.explorer { display: grid; gap: 2rem; margin-top: clamp(2.75rem, 4.5vw, 3.75rem); align-items: start; }
@media (min-width: 900px) { .explorer { grid-template-columns: 360px minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); } }

.svc-list { position: relative; padding: 0 1rem 1rem; background: var(--white); border-radius: 28px; box-shadow: var(--shadow-lg); }
.svc-list-head {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .6rem 1.25rem; margin-bottom: -.3rem; border-radius: 999px;
  background: var(--navy); color: var(--white);
  font-family: var(--font-display); font-weight: 600; font-size: .875rem; text-transform: uppercase; letter-spacing: .05em;
  transform: translateY(-50%);
}
.svc-list-head .ico { width: 17px; height: 17px; color: #A9D86E; }
.svc-group { margin: .9rem .6rem .35rem; font-size: .6875rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.svc-item {
  display: flex; align-items: center; gap: .85rem; width: 100%;
  padding: .5rem .6rem; border: 0; border-radius: 16px; background: transparent;
  color: var(--navy); font-size: .9688rem; text-align: left; cursor: pointer;
  transition: background-color .25s;
}
.svc-item b { font-family: var(--font-display); font-weight: 600; }
.si-ico { flex: 0 0 auto; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--navy); color: var(--white); transition: transform .3s var(--ease); }
.svc-item:nth-of-type(even) .si-ico { background: var(--green-hi); }
.si-ico .ico { width: 19px; height: 19px; }
.svc-item:hover { background: var(--tint-2); }
.svc-item[aria-selected="true"] { background: var(--tint); }
.svc-item[aria-selected="true"] b { color: var(--blue); }
.svc-item[aria-selected="true"] .si-ico { background: var(--sun); color: var(--navy-deep); transform: scale(1.06); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .svc-item:hover .si-ico { animation: jelly .6s var(--ease); } }

.svc-panel { display: grid; gap: 1.5rem; }
.svc-panel[hidden] { display: none; }
@media (min-width: 900px) { .svc-panel { padding-top: .5rem; } }
.svc-photo {
  position: relative; padding: 14px 14px 60px; background: var(--white); border-radius: 8px;
  box-shadow: 0 30px 60px -32px rgba(10, 46, 92, .55); transform: rotate(-1.5deg);
}
.svc-photo img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; }
.svc-photo figcaption { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; font-size: 1.85rem; color: var(--navy); }
.svc-photo .tick-badge { top: -16px; right: -16px; }
.svc-info { padding: 1.4rem 1.5rem 1.5rem; background: var(--white); border-radius: 22px; box-shadow: var(--shadow); }
.svc-top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.svc-top h3 { font-size: 1.375rem; color: var(--navy); }
.price-pill { padding: .35rem .85rem; border-radius: 999px; background: var(--sun); color: var(--navy-deep); font-family: var(--font-display); font-weight: 600; font-size: .9375rem; white-space: nowrap; }
.price-pill--soft { background: var(--tint); color: var(--navy); }
.svc-info p { margin-top: .6rem; color: var(--muted); line-height: 1.6; }
.svc-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.2rem; }
@media (prefers-reduced-motion: no-preference) {
  .svc-panel.is-entering .svc-photo { animation: foto-entra .6s var(--ease) both; }
  .svc-panel.is-entering .svc-info { animation: sobe .5s var(--ease) .08s both; }
}
@keyframes foto-entra { from { opacity: 0; transform: rotate(-6deg) translateY(14px) scale(.97); } to { opacity: 1; transform: rotate(-1.5deg); } }
@keyframes foto-entra-m { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes sobe { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (max-width: 899px) {
  /* telemóvel: a lista passa a fila de pílulas a deslizar */
  .svc-list {
    display: flex; gap: .5rem; overflow-x: auto; scrollbar-width: none;
    margin-inline: calc(var(--gutter) * -1); padding: .25rem var(--gutter) .75rem;
    background: transparent; box-shadow: none; border-radius: 0;
    scroll-snap-type: x proximity;
  }
  .svc-list::-webkit-scrollbar { display: none; }
  .svc-list-head, .svc-group { display: none; }
  .svc-item { flex: 0 0 auto; width: auto; padding: .4rem .9rem .4rem .4rem; background: var(--white); border-radius: 999px; box-shadow: 0 1px 0 var(--line), 0 10px 20px -16px rgba(10, 46, 92, .5); font-size: .875rem; white-space: nowrap; scroll-snap-align: start; }
  .si-ico { width: 32px; height: 32px; }
  .si-ico .ico { width: 16px; height: 16px; }
  .svc-photo { transform: none; padding: 10px 10px 50px; }
  .svc-photo figcaption { font-size: 1.5rem; bottom: 10px; }
  .svc-photo .tick-badge { top: -12px; right: -6px; }
  .svc-panel.is-entering .svc-photo { animation-name: foto-entra-m; }
}

/* ==========================================================================
   05 — Preços: selos redondos
   ========================================================================== */
.band--prices { overflow: hidden; background: linear-gradient(180deg, #fff 0%, var(--tint-2) 100%); }
.prices-swoosh { position: absolute; left: 0; bottom: 0; width: 100%; height: 55%; fill: var(--tint); }
.seal-grid { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end; gap: clamp(1.25rem, 2.6vw, 2.5rem); margin-top: clamp(3rem, 5vw, 4rem); }
.price-seal { display: flex; flex-direction: column; align-items: center; width: 168px; text-align: center; }
.ps-circle {
  position: relative; display: grid; place-content: center; justify-items: center;
  width: 156px; height: 156px; border-radius: 50%;
  background: var(--navy); color: var(--white);
  box-shadow: 0 0 0 7px var(--white), 0 0 0 9px rgba(28, 155, 219, .3), 0 28px 50px -24px rgba(10, 46, 92, .7);
  transition: transform .35s var(--ease);
}
/* anel tracejado interior, como um carimbo */
.ps-circle::after { content: ""; position: absolute; inset: 9px; border-radius: 50%; border: 1.5px dashed rgba(255, 255, 255, .32); }
.ps-ico { color: var(--sky-lt); margin-bottom: .1rem; }
.ps-ico .ico { width: 22px; height: 22px; }
.ps-circle strong { font-family: var(--font-display); font-weight: 600; font-size: 2.9rem; line-height: 1; letter-spacing: -.04em; }
.ps-circle small { font-size: 1.3rem; margin-left: .05em; }
.ps-per { font-size: .8125rem; color: var(--on-navy); font-weight: 500; }
.price-seal h3 { margin-top: 1.25rem; font-size: 1rem; line-height: 1.3; color: var(--navy); }
.price-seal--hi { width: 214px; }
.price-seal--hi .ps-circle { width: 196px; height: 196px; box-shadow: 0 0 0 7px var(--white), 0 0 0 11px var(--sun), 0 30px 60px -24px rgba(10, 46, 92, .75); }
.price-seal--hi .ps-circle strong { font-size: 3.7rem; color: var(--sun); }
.price-seal--hi .ps-ico { color: var(--sun); }
.ps-tag { position: relative; isolation: isolate; margin-bottom: 1.1rem; padding: .45rem 1.3rem .5rem; transform: rotate(-4deg); }
.ps-tag .brush-bg { fill: var(--sun); }
.ps-tag span { font-family: var(--font-display); font-weight: 600; font-size: .8125rem; text-transform: uppercase; letter-spacing: .06em; color: var(--navy-deep); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .price-seal:hover .ps-circle { transform: rotate(-8deg) scale(1.04); }
}
.prices-script { margin-top: 2.75rem; text-align: center; color: var(--blue); font-size: 2.1rem; transform: rotate(-1.5deg); }
.price-note { margin: .75rem auto 0; max-width: 44rem; text-align: center; color: var(--muted); font-size: .9375rem; }
.price-note strong { color: var(--navy); }
@media (max-width: 699px) {
  .seal-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 1rem; justify-items: center; }
  .price-seal { width: 100%; }
  .price-seal--hi { grid-column: 1 / -1; order: -1; }
  .ps-circle { width: 128px; height: 128px; }
  .ps-circle strong { font-size: 2.4rem; }
  .price-seal--hi .ps-circle { width: 168px; height: 168px; }
  .price-seal--hi .ps-circle strong { font-size: 3.1rem; }
  .price-seal h3 { font-size: .9375rem; margin-top: 1rem; }
}

/* ==========================================================================
   06 — Fim de obra: faixa diagonal azul-marinho, pincelada branca
   ========================================================================== */
.obra {
  position: relative; isolation: isolate; color: var(--white);
  background:
    radial-gradient(50% 60% at 90% 10%, rgba(28, 155, 219, .3), transparent 70%),
    var(--navy);
  clip-path: polygon(0 clamp(28px, 4vw, 64px), 100% 0, 100% calc(100% - clamp(28px, 4vw, 64px)), 0 100%);
  padding: calc(var(--band) + 2.5vw) 0;
}
/* duas riscas amarelas no canto, como no flyer de obra */
.obra::before {
  content: ""; position: absolute; left: -40px; bottom: clamp(60px, 7vw, 110px); width: 260px; height: 26px;
  background: linear-gradient(var(--sun), var(--sun)) 0 0 / 100% 9px no-repeat, linear-gradient(var(--sun), var(--sun)) 40px 17px / 100% 9px no-repeat;
  transform: rotate(-12deg); opacity: .9; z-index: -1;
}
.obra-grid { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 900px) { .obra-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(3rem, 6vw, 5rem); } }
.obra-title { margin-top: 1.3rem; }
.ot-small { display: block; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); color: var(--white); }
.ot-big {
  position: relative; isolation: isolate; display: inline-block; margin-top: .3rem;
  padding: .12em .5em .18em .38em; margin-left: -.2em;
  font-size: clamp(2.3rem, 1.3rem + 3.6vw, 4rem); line-height: 1.05; text-transform: uppercase; letter-spacing: -.01em;
  color: var(--navy); transform: rotate(-2deg);
}
.ot-big .brush-bg { fill: var(--white); }
.ot-big > span { position: relative; }
.obra-strap {
  display: inline-block; margin-top: 1.4rem; padding: .55rem 1rem; border-radius: 4px;
  background: var(--blue); color: var(--white);
  font-family: var(--font-display); font-weight: 600; font-size: .875rem; text-transform: uppercase; letter-spacing: .04em;
  transform: rotate(-2deg);
}
.obra-list { margin-top: 1.75rem; display: grid; gap: .6rem; }
@media (min-width: 560px) { .obra-list { grid-template-columns: repeat(2, 1fr); } }
.obra-list li { display: flex; align-items: center; gap: .65rem; padding: .8rem .95rem; border-radius: 14px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); font-weight: 500; }
.obra-list .ico { flex: 0 0 auto; width: 26px; height: 26px; padding: 4px; border-radius: 50%; background: var(--sun); color: var(--navy-deep); stroke-width: 3; }

.obra-media { position: relative; max-width: 460px; width: 100%; margin-inline: auto; }
.obra-media img { width: 100%; height: auto; aspect-ratio: 900 / 1060; object-fit: cover; border-radius: 30px; box-shadow: 0 0 0 6px rgba(255, 255, 255, .12), 0 40px 80px -40px rgba(0, 0, 0, .7); }
.obra-seal {
  position: absolute; right: -1.5rem; top: -1.75rem;
  display: grid; place-content: center; justify-items: center;
  width: 146px; height: 146px; border-radius: 50%;
  background: var(--white); color: var(--navy); transform: rotate(8deg);
  box-shadow: 0 0 0 6px var(--sun), 0 26px 50px -20px rgba(0, 0, 0, .6);
  font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: .75rem; letter-spacing: .08em;
}
.obra-seal strong { font-size: 2.6rem; line-height: 1; color: var(--blue); letter-spacing: -.03em; text-transform: none; }
.obra-flag {
  position: absolute; left: -1.5rem; bottom: 2rem; max-width: 250px;
  display: flex; align-items: center; gap: .6rem; padding: .75rem 1rem;
  border-radius: 12px; background: var(--sun); color: var(--navy-deep);
  font-family: var(--font-display); font-weight: 600; font-size: .9375rem; line-height: 1.3;
  transform: rotate(-3deg); box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .6);
}
.obra-flag .ico { flex: 0 0 auto; width: 24px; height: 24px; }
@media (prefers-reduced-motion: no-preference) { .obra-seal { animation: balanca 5s ease-in-out infinite; } }
@keyframes balanca { 0%, 100% { transform: rotate(8deg); } 50% { transform: rotate(2deg) translateY(-6px); } }
@media (max-width: 599px) {
  .obra-seal { right: .25rem; top: -1.25rem; width: 112px; height: 112px; font-size: .625rem; }
  .obra-seal strong { font-size: 2rem; }
  .obra-flag { left: .25rem; bottom: 1.25rem; font-size: .8438rem; max-width: 210px; }
}

.obra-strip { display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem; margin-top: clamp(3rem, 5vw, 4rem); }
@media (min-width: 900px) { .obra-strip { grid-template-columns: repeat(4, 1fr); gap: 1.1rem; } }
.obra-strip li { position: relative; border-radius: 16px; background: var(--white); box-shadow: 0 24px 40px -26px rgba(0, 0, 0, .7); transition: transform .35s var(--ease); }
.obra-strip img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px 16px 0 0; }
.obra-strip b { display: block; padding: .7rem .6rem; text-align: center; color: var(--navy); font-family: var(--font-display); font-weight: 600; font-size: .8125rem; text-transform: uppercase; letter-spacing: .03em; line-height: 1.25; }
.obra-strip .tick-badge { top: -12px; left: -10px; width: 36px; height: 36px; box-shadow: 0 0 0 3px var(--navy); }
.obra-strip .tick-badge .ico { width: 18px; height: 18px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .obra-strip li:hover { transform: translateY(-6px) rotate(-1deg); } }

/* ==========================================================================
   07 — Limpeza geral mensal: lista com ícones + pilha de fotos
   ========================================================================== */
.mensal { display: grid; gap: 3.5rem; align-items: center; }
@media (min-width: 900px) { .mensal { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(3rem, 6vw, 5rem); } }
.mensal-copy h2 { margin-top: 1rem; color: var(--navy); }
.mensal-list { margin-top: 2rem; display: grid; gap: 1.1rem 1.5rem; }
@media (min-width: 600px) { .mensal-list { grid-template-columns: repeat(2, 1fr); } }
.mensal-list li { display: flex; align-items: center; gap: .9rem; }
.ml-ico { flex: 0 0 auto; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--navy); color: var(--white); box-shadow: 0 0 0 5px var(--tint); }
.mensal-list li:nth-child(4n+2) .ml-ico, .mensal-list li:nth-child(4n+3) .ml-ico { background: var(--blue); }
.ml-ico .ico { width: 24px; height: 24px; }
.mensal-list li > span:last-child { color: var(--muted); font-size: .9063rem; line-height: 1.4; }
.mensal-list b { display: block; font-family: var(--font-display); font-weight: 600; font-size: 1.0625rem; color: var(--navy); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .mensal-list li:hover .ml-ico { animation: jelly .6s var(--ease); } }
.mensal-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 1.75rem; margin-top: 2.5rem; }
.brush-tag { position: relative; isolation: isolate; display: inline-flex; align-items: baseline; gap: .45rem; padding: .95rem 2.1rem 1.05rem 1.7rem; color: var(--white); transform: rotate(-3deg); }
.brush-tag .brush-bg { fill: var(--navy); filter: drop-shadow(0 14px 16px rgba(7, 31, 64, .3)); }
.brush-tag .script { font-size: 1.75rem; }
.brush-tag strong { font-family: var(--font-display); font-weight: 600; font-size: 2.6rem; line-height: 1; color: var(--sun); letter-spacing: -.03em; }
.bt-h { font-family: var(--font-display); font-weight: 600; }

.photo-stack { position: relative; display: grid; width: 100%; max-width: 470px; margin-inline: auto; }
.photo-stack img {
  position: relative; width: 100%; height: auto; aspect-ratio: 720 / 440; object-fit: cover;
  border: 6px solid var(--white); border-radius: 24px; box-shadow: 0 24px 44px -26px rgba(10, 46, 92, .6);
  transition: transform .4s var(--ease);
}
.photo-stack img + img { margin-top: -2.4rem; }
.photo-stack img:nth-child(1) { transform: rotate(-3deg) translateX(-4%); z-index: 1; }
.photo-stack img:nth-child(2) { transform: rotate(2.5deg) translateX(6%); z-index: 2; }
.photo-stack img:nth-child(3) { transform: rotate(-2deg) translateX(-3%); z-index: 3; }
.photo-stack img:nth-child(4) { transform: rotate(3deg) translateX(5%); z-index: 4; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .photo-stack img:hover { transform: rotate(0) scale(1.04); z-index: 5; } }
.doodle-heart--stack { right: -8px; top: -30px; z-index: 6; }
@media (max-width: 899px) { .photo-stack { max-width: 360px; order: -1; } }

/* ==========================================================================
   08 — Como funciona: caminho em onda
   ========================================================================== */
.path { position: relative; margin-top: clamp(3rem, 5vw, 4rem); }
.path-line { position: absolute; left: 0; top: 0; width: 100%; height: 160px; fill: none; stroke: var(--sky); stroke-width: 3px; stroke-dasharray: 1 1.4; stroke-linecap: round; opacity: .7; }
.path-line path { vector-effect: non-scaling-stroke; }
.path-steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.pstep { display: flex; flex-direction: column; align-items: center; text-align: center; }
.pstep:nth-child(even) { margin-top: 80px; }
.pstep-n {
  position: relative; display: grid; place-items: center;
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--white); color: var(--blue);
  box-shadow: 0 0 0 7px var(--tint-2), 0 20px 36px -18px rgba(10, 46, 92, .6);
}
.pstep-n .ico { width: 32px; height: 32px; stroke-width: 1.7; }
.pstep-n b { position: absolute; top: -4px; right: -4px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--sun); color: var(--navy-deep); font-family: var(--font-display); font-size: .875rem; border: 3px solid var(--tint-2); }
.pstep:nth-child(2) .pstep-n { color: var(--green); }
.pstep:nth-child(3) .pstep-n { color: var(--sky-ink); }
.pstep:nth-child(4) .pstep-n { background: var(--blue); color: var(--white); }
.pstep-n .ico-solid { fill: currentColor; stroke: none; width: 28px; height: 28px; }
.pstep h3 { margin-top: 1.2rem; font-size: 1.125rem; color: var(--navy); }
.pstep p { margin-top: .35rem; max-width: 15rem; color: var(--muted); font-size: .9375rem; line-height: 1.5; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .pstep:hover .pstep-n { animation: jelly .6s var(--ease); } }
@media (prefers-reduced-motion: no-preference) {
  .js .pstep .pstep-n { opacity: 0; transform: scale(.5); }
  .js .pstep.is-in .pstep-n { animation: marcador .7s var(--ease) var(--d, 0ms) both; }
}
@keyframes marcador { 0% { opacity: 0; transform: scale(.5) translateY(10px); } 60% { opacity: 1; transform: scale(1.12); } 100% { opacity: 1; transform: scale(1); } }
@media (max-width: 899px) {
  .path-line { display: none; }
  .path-steps { grid-template-columns: repeat(2, 1fr); gap: 2.25rem 1rem; }
  .pstep:nth-child(even) { margin-top: 0; }
  .pstep-n { width: 68px; height: 68px; }
  .pstep-n .ico { width: 28px; height: 28px; }
  .pstep h3 { font-size: 1rem; }
  .pstep p { font-size: .875rem; }
}

/* ==========================================================================
   09 — Onde estamos: mapa em lente
   ========================================================================== */
.place { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 900px) { .place { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(3rem, 6vw, 5rem); } }
.place-copy h2 { margin-top: 1rem; color: var(--navy); }
.place-copy p { margin: 1.1rem 0 1.8rem; color: var(--muted); line-height: 1.6; max-width: 30rem; }
.lens { position: relative; width: 100%; max-width: 470px; aspect-ratio: 1; margin-inline: auto; }
.swoosh--lens { fill: var(--sky); opacity: .8; transform: translate(-2%, 7%) rotate(-8deg) scale(1.12); }
.lens-map {
  position: absolute; inset: 7%; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 10px var(--white), 0 0 0 12px var(--line), 0 40px 80px -40px rgba(10, 46, 92, .6);
}
.lens-map img { width: 100%; height: 100%; object-fit: cover; }
.lens-pin { position: absolute; left: 50%; top: 50%; }
.pin-dot { position: absolute; width: 20px; height: 20px; margin: -10px 0 0 -10px; border-radius: 50%; background: var(--blue); border: 3px solid var(--white); box-shadow: 0 4px 14px rgba(10, 46, 92, .45); }
.pin-dot::before { content: ""; position: absolute; inset: -10px; border-radius: 50%; border: 2px solid var(--blue); opacity: .6; }
@media (prefers-reduced-motion: no-preference) { .pin-dot::before { animation: pulse 2.6s var(--ease) infinite; } }
@keyframes pulse { 0% { transform: scale(.7); opacity: .7; } 70% { transform: scale(1.9); opacity: 0; } 100% { opacity: 0; } }
.pin-label { position: absolute; left: 16px; top: -42px; white-space: nowrap; padding: .3rem .9rem; border-radius: 999px; background: var(--navy); color: var(--white); font-family: var(--font-display); font-weight: 600; font-size: .9375rem; box-shadow: 0 8px 18px -8px rgba(10, 46, 92, .6); }
.map-credit { position: absolute; right: 12%; bottom: 0; color: var(--muted); font-size: .6875rem; }
.map-credit a { color: inherit; }
@media (max-width: 899px) { .place-copy { text-align: center; } .place-copy p { margin-inline: auto; } }

/* ==========================================================================
   10 — Contacto: azul-marinho + formulário
   ========================================================================== */
.contact { position: relative; background: var(--navy); color: var(--white); padding: calc(var(--band) - 1rem) 0 var(--band); margin-top: clamp(40px, 6vw, 90px); }
.contact-wave { position: absolute; left: 0; bottom: calc(100% - 1px); width: 100%; height: clamp(40px, 6vw, 90px); fill: var(--navy); }
.contact-grid { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 980px) { .contact-grid { grid-template-columns: minmax(0, 1fr) minmax(400px, .95fr); gap: clamp(2.5rem, 4vw, 4rem); } }
.contact-copy { position: relative; }
.contact-script { color: var(--sun); font-size: clamp(2.2rem, 1.7rem + 1.6vw, 3rem); transform: rotate(-3deg); transform-origin: left; }
.doodle-arrow { position: absolute; right: 4%; top: -.5rem; width: 130px; fill: none; stroke: var(--sky-lt); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 979px) { .doodle-arrow { display: none; } }
.contact h2 { margin-top: .9rem; color: var(--white); max-width: 30rem; }
.big-phones { margin-top: 2rem; display: grid; gap: .9rem; }
.big-phones a, .big-phones li > span { display: inline-flex; align-items: center; gap: .9rem; color: var(--white); text-decoration: none; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem); line-height: 1.1; }
.big-phones a:hover { color: var(--sky-lt); }
.bp-ico { flex: 0 0 auto; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 14px; background: var(--blue); color: var(--white); }
.bp-ico .ico { width: 22px; height: 22px; }
.big-phones .bp-small a, .big-phones .bp-small > span { font-size: 1rem; font-family: var(--font-body); overflow-wrap: anywhere; }
.bp-small .bp-ico { width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 255, 255, .1); }
.bp-small .bp-ico .ico { width: 18px; height: 18px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .big-phones a:hover .bp-ico { animation: jelly .6s var(--ease); } }
.contact-note { margin-top: 1.1rem; color: var(--on-navy); font-size: .75rem; }
@media (max-width: 979px) { .contact-copy { text-align: center; } .contact h2 { margin-inline: auto; } .big-phones { justify-items: center; } .contact-script { transform-origin: center; } }

.final-card { padding: clamp(1.4rem, 3vw, 2.25rem); background: var(--white); color: var(--text); border-radius: var(--r-lg); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .6); }
.final-card h3 { font-size: 1.1875rem; color: var(--navy); }
.fc-sub { margin-top: .3rem; color: var(--muted); font-size: .9375rem; }
.final-card form { margin-top: 1.4rem; }

/* ---------- Campos ---------- */
.form-grid { display: grid; gap: .85rem; }
.form-row { display: grid; gap: .85rem; }
@media (min-width: 420px) { .form-row { grid-template-columns: 1fr 1fr; } }
.field label { display: block; margin-bottom: .3rem; font-size: .8125rem; font-weight: 600; color: var(--navy); }
.field .opt { font-weight: 400; color: var(--muted); }
.field input, .field select, .field textarea { width: 100%; padding: .8rem .95rem; border: 1.5px solid #7B8FA6; border-radius: var(--r-sm); background: var(--tint-2); color: var(--text); transition: border-color .25s, background-color .25s, box-shadow .25s; }
.field textarea { resize: vertical; min-height: 84px; }
.field ::placeholder { color: #5F6F82; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--blue); background: var(--white); box-shadow: 0 0 0 3px rgba(5, 99, 174, .16); }
.field [aria-invalid="true"] { border-color: var(--error); }
.field .err { display: block; margin-top: .3rem; color: var(--error); font-size: .75rem; }
.form-status { font-size: .875rem; }
.form-status:empty { display: none; }
.form-status.is-ok { color: var(--wa); font-weight: 600; }
.form-status.is-err { color: var(--error); font-weight: 600; }
.consent { display: flex; gap: .55rem; align-items: flex-start; font-size: .8125rem; color: var(--muted); }

/* ==========================================================================
   Rodapé
   ========================================================================== */
.site-footer { background: var(--white); color: var(--muted); padding: clamp(3.5rem, 5vw, 4.5rem) 0 2.5rem; }
.footer-grid { display: grid; gap: 2.5rem; }
@media (min-width: 720px) { .footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .footer-grid { grid-template-columns: 1.5fr 1fr 1fr 1.3fr; } }
.footer-brand img { width: 210px; height: auto; }
.footer-script { margin-top: 1rem; color: var(--sky-ink); font-size: 1.7rem; max-width: 18rem; }
.site-footer h3 { color: var(--navy); font-size: 1rem; margin-bottom: .9rem; }
.footer-links { display: grid; gap: .6rem; font-size: .9375rem; }
.footer-links a { text-decoration: none; transition: color .2s; }
.footer-links a:hover { color: var(--blue); }
.footer-links li > span, .footer-links li > a { display: inline-flex; align-items: flex-start; gap: .55rem; }
.footer-links .ico { flex: 0 0 auto; width: 17px; height: 17px; margin-top: .2rem; color: var(--blue); }
.footer-mail { font-size: .875rem; overflow-wrap: anywhere; }
.footer-bottom { margin-top: 2.75rem; padding-top: 1.5rem; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; justify-content: space-between; font-size: .8125rem; }
@media (max-width: 719px) {
  .footer-grid { text-align: center; justify-items: center; }
  .footer-brand img, .footer-script { margin-inline: auto; }
  .footer-links li > span, .footer-links li > a { justify-content: center; }
  .footer-bottom { justify-content: center; text-align: center; }
}

/* ==========================================================================
   Conversão: WhatsApp flutuante + barra fixa
   ========================================================================== */
.wa-float { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 40; display: none; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #fff; box-shadow: 0 16px 34px -12px rgba(37, 211, 102, .8); }
.wa-float .ico { width: 29px; height: 29px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .wa-float:hover { animation: jelly .6s var(--ease); } }
@media (min-width: 900px) { .wa-float.is-on { display: grid; } }
.mobile-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: none; gap: .6rem; padding: .7rem var(--gutter) calc(.7rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px); border-top: 1px solid var(--line); }
.mobile-bar .btn { flex: 1; padding: .8rem .5rem; }
@media (max-width: 899px) { .mobile-bar.is-on { display: flex; } body.has-bar { padding-bottom: 76px; } }

/* ==========================================================================
   Popup de orçamento
   ========================================================================== */
dialog.modal { border: 0; padding: 0; background: transparent; width: min(520px, 94vw); max-width: none; }
dialog.modal::backdrop { background: rgba(7, 31, 64, .62); backdrop-filter: blur(3px); }
.modal-card { position: relative; padding: clamp(1.3rem, 4vw, 2rem); background: var(--white); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); border-top: 6px solid var(--sun); }
.modal-script { color: var(--green); font-size: 1.75rem; transform: rotate(-2deg); transform-origin: left; }
.modal-card h2 { margin-top: .2rem; color: var(--navy); font-size: var(--s-2); }
.modal-lead { margin-top: .4rem; color: var(--muted); font-size: .9375rem; }
.modal-card form { margin-top: 1.1rem; }
.modal-close { position: absolute; right: 1rem; top: 1rem; display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--tint); color: var(--navy); cursor: pointer; }
.modal-close:hover { background: #D5E6F4; }
.qc-alt { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: center; gap: .5rem; flex-wrap: wrap; color: var(--muted); font-size: .875rem; text-align: center; }
.qc-alt a { color: var(--wa); font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.qc-alt a .ico { width: 17px; height: 17px; }
@media (max-height: 720px), (max-width: 419px) {
  .modal-card { padding: 1.1rem 1.1rem 1.15rem; }
  .modal-script { font-size: 1.45rem; }
  .modal-card h2 { font-size: 1.25rem; }
  .modal-lead { font-size: .875rem; margin-top: .25rem; }
  .modal-card form { margin-top: .8rem; }
  .modal-card .form-grid, .modal-card .form-row { gap: .6rem; }
  .modal-card .field label { margin-bottom: .2rem; font-size: .75rem; }
  .modal-card .field input, .modal-card .field select { padding: .62rem .75rem; }
  .modal-card .btn { padding: .75rem 1.2rem; }
  .modal-card .qc-alt { margin-top: .7rem; padding-top: .7rem; }
  .modal-close { width: 32px; height: 32px; right: .75rem; top: .75rem; }
}
@media (max-width: 419px) { .modal-card .form-row { grid-template-columns: 1fr 1fr; } }

/* ==========================================================================
   Entrada suave
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
  .js .reveal { opacity: 0; translate: 0 22px; }
  .js .reveal.is-in { opacity: 1; translate: 0 0; transition: opacity .75s var(--ease) var(--d, 0ms), translate .75s var(--ease) var(--d, 0ms); }
  .js .reveal-left { opacity: 0; translate: -26px 0; }
  .js .reveal-right { opacity: 0; translate: 26px 0; }
  @media (max-width: 899px) { .js .reveal-left, .js .reveal-right { translate: 0 22px; } }
  .js .reveal-left.is-in, .js .reveal-right.is-in { opacity: 1; translate: 0 0; transition: opacity .8s var(--ease) var(--d, 0ms), translate .8s var(--ease) var(--d, 0ms); }
  /* elementos inclinados entram com escala, sem perder a inclinação */
  .js .pop { opacity: 0; scale: .85; }
  .js .pop.is-in { opacity: 1; scale: 1; transition: opacity .6s var(--ease) var(--d, 0ms), scale .7s cubic-bezier(.3, 1.4, .5, 1) var(--d, 0ms); }

  /* hero ao carregar */
  .js .hero-copy > * { opacity: 0; translate: 0 18px; }
  .js .hero.is-ready .hero-copy > * { opacity: 1; translate: 0 0; transition: opacity .8s var(--ease) var(--d, 0ms), translate .8s var(--ease) var(--d, 0ms); }
  .js .hero-copy > :nth-child(1) { --d: 80ms; }
  .js .hero-copy > :nth-child(2) { --d: 180ms; }
  .js .hero-copy > :nth-child(3) { --d: 280ms; }
  .js .hero-copy > :nth-child(4) { --d: 380ms; }
  .js .hero-copy > :nth-child(5) { --d: 460ms; }
  .js .hero-copy > :nth-child(6) { --d: 520ms; }
  .js .hero-blob, .js .hero .swoosh { opacity: 0; scale: .9; }
  .js .hero.is-ready .hero-blob { opacity: 1; scale: 1; transition: opacity 1s var(--ease) .1s, scale 1.2s var(--ease) .1s; }
  .js .hero.is-ready .swoosh--back { opacity: .85; scale: 1; transition: opacity .9s var(--ease) .35s, scale 1.1s var(--ease) .35s; }
  .js .hero.is-ready .swoosh--front { opacity: 1; scale: 1; transition: opacity .9s var(--ease) .5s, scale 1.1s var(--ease) .5s; }
  .js .seal, .js .brush-price { opacity: 0; scale: .6; }
  .js .hero.is-ready .seal { opacity: 1; scale: 1; transition: opacity .6s var(--ease) .8s, scale .7s cubic-bezier(.3, 1.5, .5, 1) .8s; }
  .js .hero.is-ready .brush-price { opacity: 1; scale: 1; transition: opacity .6s var(--ease) 1s, scale .7s cubic-bezier(.3, 1.5, .5, 1) 1s; }
}

/* ==========================================================================
   Afinações de telemóvel
   ========================================================================== */
@media (max-width: 599px) {
  .head p { font-size: var(--s-0); }
  .btn { padding: .95rem 1.5rem; }
  .cta-row .btn, .hero-actions .btn, .actions .btn, .mensal-foot .btn { width: 100%; }
  .mensal-foot { justify-content: center; }
  .final-card { padding: 1.4rem 1.2rem 1.5rem; }
  .site-footer .footer-grid > * + * { padding-top: 2rem; border-top: 1px solid var(--line); width: 100%; }
  .about-cards li { grid-template-columns: 40px 1fr; column-gap: .8rem; align-items: center; }
  .about-cards .ac-ico { grid-row: span 2; }
  .about-cards strong { margin-top: 0; }
  .about-script { text-align: center; transform-origin: center; }
}

/* telemóvel: imagens antes do texto e nada a sair do ecrã */
@media (max-width: 899px) {
  .obra-media { order: -1; }
  .lens { order: -1; max-width: 380px; }
  .swoosh--lens { transform: translate(-1%, 6%) rotate(-8deg) scale(1.02); }
}
@media (max-width: 599px) {
  .polaroids { max-width: 340px; height: 400px; }
  .polaroid .tick-badge { top: -12px; right: -8px; width: 36px; height: 36px; }
  .polaroid figcaption { font-size: 1.4rem; }
  .polaroid--b { right: 2%; }
  .photo-stack { max-width: 300px; }
  .photo-stack img + img { margin-top: -1.6rem; }
  .photo-stack img:nth-child(1) { transform: rotate(-3deg) translateX(-2%); }
  .photo-stack img:nth-child(2) { transform: rotate(2.5deg) translateX(3%); }
  .photo-stack img:nth-child(3) { transform: rotate(-2deg) translateX(-2%); }
  .photo-stack img:nth-child(4) { transform: rotate(3deg) translateX(2%); }
  .svc-actions .btn { flex: 1 1 0; padding-inline: .8rem; }
  .obra-strip .tick-badge { top: 8px; left: 8px; }
  .svc-photo .tick-badge { top: 8px; right: 8px; }
}


/* ==========================================================================
   Revisão: verde do logótipo, confiança (espaço preparado) e telemóvel
   ========================================================================== */
.mark--green .mark-line { stroke: var(--green-hi); }

.demo-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .28rem .7rem; border-radius: 999px;
  background: var(--navy); color: var(--white);
  font-size: .75rem; font-weight: 600; letter-spacing: .02em;
}
.demo-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--sun); }

.trust { display: grid; gap: 2.5rem; margin-top: clamp(2.75rem, 4.5vw, 3.75rem); align-items: center; }
@media (min-width: 900px) { .trust { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(2.5rem, 5vw, 4.5rem); } }

.owner { display: grid; justify-items: center; text-align: center; max-width: 380px; margin-inline: auto; }
.owner-photo { position: relative; width: 100%; max-width: 300px; }
.owner-photo img {
  width: 100%; height: auto; aspect-ratio: 600 / 720; object-fit: cover;
  border-radius: 48% 52% 46% 54% / 40% 40% 60% 60%;
  box-shadow: 0 0 0 8px var(--white), 0 0 0 10px var(--tint), 0 34px 60px -30px rgba(10, 46, 92, .6);
}
.owner-photo .demo-badge { position: absolute; left: 50%; bottom: -.6rem; transform: translateX(-50%); }
.owner figcaption { display: grid; justify-items: center; gap: .3rem; margin-top: 1.6rem; }
.owner-script { color: var(--green); font-size: 1.9rem; transform: rotate(-2deg); }
.owner-name { font-family: var(--font-display); font-size: 1.25rem; color: var(--navy); }
.owner-role { color: var(--muted); font-size: .875rem; margin-bottom: .7rem; }

.chat {
  position: relative; overflow: hidden; max-width: 560px; width: 100%; margin-inline: auto;
  border-radius: 26px; background: #ECE5DD;
  box-shadow: 0 34px 70px -38px rgba(10, 46, 92, .6);
  transform: rotate(1deg);
}
.chat-head { display: flex; align-items: center; gap: .8rem; padding: .9rem 1.1rem; background: #075E54; color: var(--white); }
.chat-head > span:nth-child(2) { display: grid; line-height: 1.25; margin-right: auto; }
.chat-head strong { font-family: var(--font-display); font-size: 1rem; }
.chat-head small { font-size: .75rem; opacity: .8; }
.chat-ava { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .15); }
.chat-ava .ico { width: 20px; height: 20px; }
.chat-head .demo-badge { background: var(--sun); color: var(--navy-deep); }
.chat-head .demo-badge::before { background: var(--navy); }
.chat-body { display: grid; gap: .6rem; padding: 1.2rem 1rem 1rem; }
.bubble {
  position: relative; max-width: 86%; padding: .6rem .8rem 1.25rem;
  background: var(--white); border-radius: 4px 14px 14px 14px;
  color: var(--text); font-size: .9375rem; line-height: 1.45;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .08);
}
.bubble b { display: block; margin-bottom: .1rem; color: var(--sky-ink); font-size: .8125rem; }
.bubble time { position: absolute; right: .6rem; bottom: .3rem; color: #667781; font-size: .6875rem; }
.bubble--me { justify-self: end; background: #D9FDD3; border-radius: 14px 4px 14px 14px; }
.chat-note { padding: 0 1.1rem 1.1rem; color: #54656F; font-size: .8125rem; text-align: center; }

/* telemóvel: botão de orçamento no primeiro ecrã */
@media (max-width: 899px) {
  .hero-art { max-width: 300px; }
  .hero-phones, .hero-note { display: none; }
  .hero h1 { margin-top: .6rem; }
  .hero-actions { margin-top: 1.5rem; }
  .hero-grid { gap: 1.25rem; }
  .chat { transform: none; }
}
@media (max-width: 599px) {
  .hero-art { max-width: 260px; }
  .hero-script { font-size: 1.35rem; }
  .hero h1 { font-size: 2.35rem; }
  .hero-lead { margin-top: .9rem; font-size: 1rem; }
}


/* ==========================================================================
   Revisão de telemóvel
   ========================================================================== */
.nowrap { white-space: nowrap; }
main { overflow-x: hidden; }   /* recurso para Safari < 16, que não conhece overflow-x: clip */

/* alvos de toque */
.tb-phones a { padding-block: .55rem; }
.hp-ico { width: 44px; height: 44px; }
.footer-links { gap: 0; }
.footer-links a, .footer-links li > span { padding-block: .55rem; }
.modal-close { width: 40px !important; height: 40px !important; }
.qc-alt a { padding: .6rem .3rem; }

/* barra fixa: desliza em vez de aparecer de repente */
@media (max-width: 899px) {
  .mobile-bar { display: flex; transform: translateY(110%); transition: transform .35s var(--ease); }
  .mobile-bar.is-on { transform: none; }
}

@media (max-width: 899px) {
  /* lista de serviços em pílulas: margem ao deslizar, pílula escolhida bem marcada, dica de que desliza */
  .svc-list { scroll-padding-inline: var(--gutter); -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent); mask-image: linear-gradient(90deg, #000 86%, transparent); }
  .svc-item[aria-selected="true"] { background: var(--navy); color: var(--white); }
  .svc-item[aria-selected="true"] b { color: var(--sun); }
  /* cabeçalhos das secções divididas centrados, listas à esquerda */
  .about-copy, .obra-copy, .mensal-copy { text-align: center; }
  .about-cards, .obra-list, .mensal-list, .about-copy > p, .mensal-copy > p { text-align: left; }
  .actions, .mensal-foot { justify-content: center; }
  .ot-big { margin-left: 0; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .svc-panel { grid-template-columns: 1fr 1fr; align-items: center; }
}
@media (max-width: 599px) {
  .hero { padding-top: .75rem; }
  .hero-art { max-width: min(260px, 31svh); }
  .polaroid figcaption { font-size: 1.2rem; }
  .polaroid--b { width: 47%; right: 0; }
  .seal-grid { align-items: start; }
  .photo-stack img:nth-child(n+3) { display: none; }
  .lens { max-width: 280px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1rem; }
  .footer-brand, .footer-grid > div:last-child { grid-column: 1 / -1; }
  .site-footer .footer-grid > * + * { padding-top: 0; border-top: 0; }
  .site-footer .footer-grid > div:last-child { padding-top: 1.5rem; border-top: 1px solid var(--line); }
}
@media (max-width: 399px) { .svc-actions .btn { flex-basis: 100%; } }
.band--tint .about-cards li { background: var(--white); box-shadow: 0 1px 0 var(--line), 0 14px 30px -24px rgba(10, 46, 92, .45); }
@media (max-width: 899px) { .about-copy > p.about-script { text-align: center; transform-origin: center; } }
/* ecrãs baixos (ex.: 360×640): botão de orçamento inteiro no primeiro ecrã */
@media (max-width: 599px) and (max-height: 700px) {
  .hero-art { max-width: 150px; }
  .seal { width: 76px; height: 76px; }
  .seal-ring { display: none; }
  .seal-core { inset: 6px; }
  .brush-price { padding: .55rem 1.1rem .65rem; }
  .bp-label { display: none; }
  .bp-value strong { font-size: 1.5rem; }
}