
  :root{
    --ink:#0E2A33; --ink-soft:#41606A; --mist:#EFF6F7; --paper:#FFFFFF;
    --water:#0E9AAA; --water-deep:#0B7C8A; --sky:#2E86DE; --leaf:#1FA463;
    --line:#D8E6E8; --shadow:0 18px 40px -24px rgba(14,42,51,.45);
    --spectrum:linear-gradient(90deg,#E94B5A,#F39C12,#F1C40F,#1FA463,#2E86DE,#8E44AD);
    --maxw:1140px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    margin:0; font-family:Inter,system-ui,sans-serif; color:var(--ink);
    background:var(--paper); line-height:1.6; -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{font-family:"Bricolage Grotesque",sans-serif; line-height:1.08; letter-spacing:-.02em; margin:0}
  p{margin:0}
  a{color:inherit}
  img{max-width:100%; display:block}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
  .section{padding:84px 0}
  section[id]{scroll-margin-top:92px}
  .eyebrow{font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--water-deep)}
  .spectrum-line{height:4px; width:64px; border-radius:4px; background:var(--spectrum)}

  /* ---- Botões ---- */
  .btn{display:inline-flex; align-items:center; gap:.55rem; font-weight:600; font-size:1rem;
    padding:.85rem 1.5rem; border-radius:999px; text-decoration:none; border:1.5px solid transparent;
    cursor:pointer; transition:transform .15s ease, box-shadow .15s ease}
  .btn:hover{transform:translateY(-2px)}
  .btn-primary{background:var(--water); color:#fff; box-shadow:0 12px 24px -12px rgba(14,154,170,.8)}
  .btn-wa{background:#25D366; color:#fff}
  .btn-ghost{background:transparent; color:var(--ink); border-color:var(--line)}

  /* ---- Header ---- */
  header{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.88);
    backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
  .nav{display:flex; align-items:center; justify-content:space-between; height:80px}
  .brand{display:flex; align-items:center; gap:.7rem; text-decoration:none}
  .brand-mark{width:42px;height:42px;object-fit:contain;flex:0 0 auto}
  header .brand-mark{width:60px;height:60px}
  .brand-name{font-family:"Bricolage Grotesque";font-weight:800;font-size:1.3rem;letter-spacing:-.02em;line-height:1.05}
  .brand-tag{font-family:"Bricolage Grotesque",sans-serif;font-weight:600;font-size:.98rem;color:var(--ink-soft);letter-spacing:-.01em;line-height:1.1}
  .menu{display:flex; align-items:center; gap:30px}
  .menu nav{display:flex; gap:36px}
  .menu nav a{text-decoration:none; font-weight:500; font-size:1.06rem; color:var(--ink-soft)}
  .menu nav a:hover{color:var(--water-deep)}
  .menu-toggle{display:none; background:none; border:0; cursor:pointer; padding:8px}
  .menu-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:.2s}

  /* ---- Hero ---- */
  .hero{background:
      radial-gradient(900px 480px at 88% -10%, rgba(46,134,222,.12), transparent 60%),
      radial-gradient(700px 420px at 0% 110%, rgba(14,154,170,.12), transparent 55%),
      var(--mist)}
  .hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; padding:78px 0}
  .hero h1{font-size:clamp(2.1rem,4.6vw,3.55rem); margin:18px 0 0}
  .hero h1 em{font-style:normal; color:var(--water-deep)}
  .hero .lead{font-size:1.13rem; color:var(--ink-soft); margin-top:22px; max-width:33em}
  .trust-row{display:flex; flex-wrap:wrap; gap:22px; margin-top:34px}
  .trust{display:flex; align-items:center; gap:10px; font-size:.9rem; color:var(--ink-soft); font-weight:500}
  .trust b{font-family:"Bricolage Grotesque"; color:var(--ink); font-size:1.05rem}
  .trust .ic{width:34px;height:34px;border-radius:9px;background:#fff;border:1px solid var(--line);
    display:grid;place-items:center;color:var(--water)}

  /* media block (placeholder elegante p/ foto) */
  .media{position:relative}
  .media-frame{aspect-ratio:4/3; border-radius:22px; overflow:hidden; box-shadow:var(--shadow);
    background:linear-gradient(135deg,#0B7C8A,#2E86DE); display:grid; place-items:center; color:#fff}
  .media-frame img{width:100%;height:100%;object-fit:cover}
  .media-frame.product{aspect-ratio:5/6; max-width:330px; margin:0 auto; background:radial-gradient(120% 100% at 50% 0%, #F3FAFB, #D9ECEF); padding:24px}
  .media-frame.product img{width:100%;height:100%;object-fit:contain;
    filter:drop-shadow(0 18px 26px rgba(14,42,51,.28))}
  .media-ph{text-align:center;opacity:.92;padding:24px}
  .media-ph svg{width:56px;height:56px;margin-bottom:10px}
  .stat-card{position:absolute; left:-22px; bottom:-22px; background:#fff; border-radius:16px;
    padding:16px 20px; box-shadow:var(--shadow); border:1px solid var(--line)}
  .stat-card .n{font-family:"Bricolage Grotesque"; font-weight:800; font-size:1.9rem; color:var(--leaf); line-height:1}
  .stat-card .l{font-size:.82rem; color:var(--ink-soft); margin-top:2px}

  /* ---- Faixa de selos ---- */
  .badges{background:var(--ink); color:#fff}
  .badges .wrap{display:flex; flex-wrap:wrap; gap:10px 22px; justify-content:center; align-items:center; padding:18px 20px}
  .badge{display:flex; align-items:center; gap:8px; font-size:.8rem; opacity:.92; white-space:nowrap}
  .badge svg{width:18px;height:18px;color:#7FE3CF;flex:0 0 auto}

  /* ---- Serviços ---- */
  .head{max-width:40em}
  .head h2{font-size:clamp(1.7rem,3vw,2.4rem); margin:14px 0 12px}
  .head p{color:var(--ink-soft)}
  .grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px}
  .card{background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:28px;
    transition:transform .18s ease, box-shadow .18s ease}
  .card:hover{transform:translateY(-4px); box-shadow:var(--shadow)}
  .card .ic{width:48px;height:48px;border-radius:12px;background:var(--mist);display:grid;place-items:center;
    color:var(--water-deep);margin-bottom:16px}
  .card h3{font-size:1.18rem; margin-bottom:8px}
  .card p{color:var(--ink-soft); font-size:.96rem}

  /* ---- Processo ---- */
  .process{background:var(--mist)}
  .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:44px}
  .step{background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px 26px;position:relative}
  .step .num{font-family:"Bricolage Grotesque";font-weight:800;font-size:1rem;color:#fff;background:var(--water);
    width:38px;height:38px;border-radius:10px;display:grid;place-items:center;margin-bottom:16px}
  .step h3{font-size:1.12rem;margin-bottom:8px}
  .step p{color:var(--ink-soft);font-size:.95rem}

  /* ---- Equipamento ---- */
  .equip-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center}
  .equip ul{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:14px}
  .equip li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-soft)}
  .equip li svg{width:22px;height:22px;color:var(--leaf);flex:0 0 auto;margin-top:3px}
  .equip li b{color:var(--ink)}

  /* ---- Certificações ---- */
  .certs{background:var(--mist)}
  .certs .head{margin:0 auto;text-align:center}
  .cert-grid{margin-top:44px}
  .cert-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px 24px;text-align:center;
    transition:transform .18s ease, box-shadow .18s ease}
  .cert-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
  .cert-badge{height:120px;margin:0 auto 18px;display:grid;place-items:center}
  .cert-badge img{max-height:120px;max-width:190px;object-fit:contain}
  .cert-badge.ph{width:118px;height:118px;border-radius:16px;background:var(--mist);border:2px dashed var(--line);color:var(--ink-soft);font-size:.72rem;line-height:1.3;padding:12px}
  .cert-card h3{font-size:1.05rem;margin-bottom:8px}
  .cert-card p{color:var(--ink-soft);font-size:.92rem}

  /* ---- FAQ ---- */
  .faq{max-width:760px;margin:44px auto 0}
  .qa{border:1px solid var(--line);border-radius:14px;margin-bottom:12px;background:#fff;overflow:hidden;
    transition:border-color .15s ease, box-shadow .15s ease}
  .qa:hover{border-color:#BEDDE1}
  .qa[open]{box-shadow:var(--shadow);border-color:#BEDDE1}
  .qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;
    padding:20px 22px;font-family:"Bricolage Grotesque";font-weight:600;font-size:1.05rem;color:var(--ink);
    transition:background .15s ease;-webkit-tap-highlight-color:transparent}
  .qa summary::-webkit-details-marker{display:none}
  .qa summary:hover{background:var(--mist)}
  .qa[open] summary{background:var(--mist)}
  .qa summary:focus-visible{outline:2px solid var(--water);outline-offset:-3px;border-radius:14px}
  .qa .chev{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--mist);
    display:grid;place-items:center;color:var(--water-deep);
    transition:transform .25s ease, background .2s ease, color .2s ease}
  .qa summary:hover .chev{background:#DBEFF2}
  .qa[open] .chev{transform:rotate(180deg);background:var(--water);color:#fff}
  .qa .ans{padding:2px 22px 22px;color:var(--ink-soft)}
  .qa[open] .ans{animation:faqIn .26s ease both}
  @keyframes faqIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

  /* ---- Depoimentos ---- */
  .reviews{background:var(--mist)}
  .reviews .head{margin:0 auto;text-align:center}
  .reviews-embed{margin-top:38px}

  /* ---- Orçamento / Form ---- */
  .quote{background:var(--ink); color:#fff}
  .quote .spectrum-line{margin-bottom:18px}
  .quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
  .quote h2{font-size:clamp(1.8rem,3vw,2.5rem);color:#fff}
  .quote p.sub{color:#B9D2D7;margin-top:14px;max-width:34em}
  .quote .wa-block{margin-top:28px;display:grid;gap:12px}
  .quote .wa-card{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:16px 18px;text-decoration:none;color:#fff}
  .quote .wa-card:hover{background:rgba(255,255,255,.12)}
  .quote .wa-card .city{font-weight:600}
  .quote .wa-card .tel{font-size:.88rem;color:#B9D2D7}
  .quote .wa-card svg{width:30px;height:30px;color:#25D366;flex:0 0 auto;margin-left:auto}
  form.lead{background:#fff;border-radius:20px;padding:30px;color:var(--ink)}
  form.lead label{display:block;font-size:.86rem;font-weight:600;margin:0 0 6px}
  form.lead .field{margin-bottom:16px}
  form.lead input,form.lead select,form.lead textarea{width:100%;padding:.8rem .9rem;border:1.5px solid var(--line);
    border-radius:10px;font:inherit;color:var(--ink);background:#fff}
  form.lead input:focus,form.lead select:focus,form.lead textarea:focus{outline:none;border-color:var(--water);
    box-shadow:0 0 0 3px rgba(14,154,170,.15)}
  form.lead .btn-primary{width:100%;justify-content:center;margin-top:6px}
  form.lead .hint{font-size:.8rem;font-weight:400;color:var(--ink-soft);margin:-2px 0 10px}
  form.lead input[type=file]{padding:.55rem .7rem;font-size:.88rem;color:var(--ink-soft);cursor:pointer}
  form.lead input[type=file]+input[type=file]{margin-top:8px}
  form.lead input[type=file]::file-selector-button{font:inherit;font-weight:600;font-size:.82rem;color:#fff;
    background:var(--water);border:0;border-radius:8px;padding:.45rem .85rem;margin-right:.7rem;cursor:pointer;
    transition:background .15s ease}
  form.lead input[type=file]::file-selector-button:hover{background:var(--water-deep)}
  form.lead .priv{font-size:.78rem;color:var(--ink-soft);margin-top:12px;text-align:center}
  .form-ok{display:none;background:#E9F8F0;border:1px solid #B7E6CC;color:#15703F;
    border-radius:12px;padding:20px;text-align:center;font-weight:500}
  .hp{position:absolute;left:-9999px}

  /* ---- Footer ---- */
  footer{background:#08191E;color:#9FBAC0;font-size:.92rem}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px;padding:56px 0 30px}
  .foot-grid h4{color:#fff;font-family:"Bricolage Grotesque";font-size:1rem;margin:0 0 14px}
  .foot-grid a{color:#9FBAC0;text-decoration:none}
  .foot-grid a:hover{color:#fff}
  .foot-grid .row{margin-bottom:8px}
  .social{display:flex;gap:12px;margin-top:14px}
  .social a{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.16);
    display:grid;place-items:center;color:#cfe2e6}
  .social a:hover{background:rgba(255,255,255,.1)}
  .copy{border-top:1px solid rgba(255,255,255,.1);padding:18px 0;text-align:center;font-size:.82rem;color:#6f8a91}

  /* ---- Hero banner (fundo full-bleed + texto real por cima) ---- */
  .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}
  .hero-banner{position:relative;min-height:82vh;display:flex;align-items:flex-start;justify-content:center;
    background:url('images/hero-banner.jpg') center bottom/cover no-repeat;background-color:var(--mist)}
  .hero-banner-scrim{position:absolute;inset:0;background:linear-gradient(180deg,
    rgba(244,249,250,.76) 0%, rgba(244,249,250,.51) 42%, rgba(244,249,250,.1) 72%, rgba(244,249,250,0) 100%)}
  .hero-banner-inner{position:relative;z-index:1;max-width:820px;text-align:center;padding:6vh 24px 0}
  .hero-banner h1{font-family:"Bricolage Grotesque",sans-serif;font-size:clamp(1.95rem,4.2vw,3.15rem);
    color:var(--ink);line-height:1.08;letter-spacing:-.02em;text-shadow:0 1px 12px rgba(244,249,250,.7)}
  .hero-sub{margin:16px auto 0;max-width:34em;color:var(--ink-soft);font-size:clamp(1rem,1.5vw,1.14rem);
    text-shadow:0 1px 10px rgba(244,249,250,.75)}
  .hero-cta{margin-top:26px;font-size:1.08rem;padding:1rem 2.2rem;justify-content:center}
  .hero-badge{position:absolute;top:16px;left:74%;transform:translateX(-50%);z-index:2;width:155px;height:auto;
    filter:drop-shadow(0 10px 22px rgba(14,42,51,.28))}
  @media (max-width:1500px){
    .hero-badge{left:auto;right:5%;transform:none}
  }
  @media (max-width:1000px){
    .hero-badge{top:auto;bottom:16px;left:16px;right:auto;transform:none;width:100px}
  }
  @media (max-width:600px){
    .hero-banner{min-height:78vh;background-position:62% bottom}
    .hero-banner-inner{padding:6vh 18px 0}
    .hero-cta{width:100%;max-width:340px;justify-content:center;font-size:1.05rem;padding:.95rem 1.8rem}
  }

  /* ---- WhatsApp flutuante ---- */
  .wa-float{position:fixed;right:22px;bottom:22px;z-index:60;width:105px;height:105px;border-radius:50%;
    background:#25D366;display:grid;place-items:center;box-shadow:0 12px 34px -8px rgba(37,211,102,.75)}
  .wa-float svg{width:57px;height:57px;color:#fff}
  @media (max-width:600px){.wa-float{width:93px;height:93px;right:16px;bottom:16px}.wa-float svg{width:51px;height:51px}}

  /* ---- Responsivo ---- */
  @media (max-width:900px){
    .menu nav{display:none}
    .menu-toggle{display:block}
    .menu.open nav{display:flex;position:absolute;top:80px;left:0;right:0;background:#fff;
      flex-direction:column;padding:18px 24px;border-bottom:1px solid var(--line);gap:18px}
    .hero-grid,.equip-grid,.quote-grid{grid-template-columns:1fr;gap:36px}
    .grid3,.steps{grid-template-columns:1fr}
    .foot-grid{grid-template-columns:1fr;gap:28px}
    .section{padding:60px 0}
    .stat-card{left:0}
  }
  @media (prefers-reduced-motion:reduce){*{scroll-behavior:auto;transition:none!important;animation:none!important}}

  /* ---- Página de serviço (vídeo + texto lado a lado) ---- */
  .svc-main{background:#fff}
  .svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:70px 0}
  .video-wrap{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;
    box-shadow:var(--shadow);border:1px solid var(--line);background:#000}
  .video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
  .svc-seals{display:flex;gap:22px;justify-content:center;align-items:center;margin-top:24px;flex-wrap:wrap}
  .svc-seals img{height:64px;width:auto;object-fit:contain}
  .svc-right .eyebrow{display:block}
  .svc-right h1{font-family:"Bricolage Grotesque",sans-serif;font-size:clamp(1.7rem,3vw,2.35rem);
    color:var(--ink);line-height:1.1;letter-spacing:-.02em;margin:12px 0 18px}
  .svc-text p{color:var(--ink-soft);margin-bottom:14px}
  .svc-text p b{color:var(--ink)}
  .svc-right .btn{margin-top:8px}
  @media (max-width:860px){
    .svc-grid{grid-template-columns:1fr;gap:30px;padding:44px 0}
    .svc-right{text-align:center}
    .svc-text{text-align:left}
    .svc-right .btn{width:100%;max-width:340px;justify-content:center}
  }

  /* ---- Bloco de preço (intenção de busca 'preço/quanto custa') ---- */
  .svc-price{background:var(--mist);border:1px solid var(--line);border-left:4px solid var(--water);
    border-radius:12px;padding:18px 20px;margin:6px 0 22px}
  .svc-price h2{font-family:"Bricolage Grotesque",sans-serif;font-size:1.06rem;color:var(--ink);margin:0 0 6px;letter-spacing:-.01em}
  .svc-price p{color:var(--ink-soft);margin:0;font-size:.96rem}
