/* =========================================================================
   AÇOS LITORAL — orcamentos.css (v12)
   Específico da página Orçamentos. Depende de /assets/css/base.css.
   ========================================================================= */

.q-layout{display:grid;grid-template-columns:1.6fr .9fr;gap:clamp(22px,3vw,36px);align-items:start}

.q-form{background:var(--paper);border:1px solid var(--hair);border-radius:var(--r-lg);padding:clamp(24px,3vw,40px);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:clamp(26px,3vw,38px)}
.q-block{border:0;padding:0;margin:0;min-width:0}
.q-block+.q-block{border-top:1px solid var(--hair);padding-top:clamp(24px,3vw,34px)}
.q-legend{display:flex;align-items:center;gap:12px;width:100%;font-size:1.05rem;font-weight:900;letter-spacing:-.02em;margin-bottom:20px}
.q-legend span{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:var(--ink);color:var(--yellow);font-size:.92rem;font-weight:900}

.form-block{display:flex;flex-direction:column;gap:11px;margin-bottom:20px;min-width:0}
.form-block:last-child{margin-bottom:0}
.block-label{font-size:.84rem;font-weight:800;color:#2b303b}
.block-hint{font-size:.82rem;color:var(--steel);line-height:1.55;margin:-6px 0 20px}
.block-hint[hidden]{display:none}
.form-block.invalid .err{display:block}
.form-block.invalid .opt span{border-color:#c02617;background:#fff6f5}
.form-block.invalid .consent{color:#c02617}
.form-block.invalid .consent input{outline:2px solid #c02617;outline-offset:2px}

.q-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}


/* Coluna de apoio */
.q-aside{display:grid;gap:18px;align-content:start}
@media (min-height:900px){.q-aside{position:sticky;top:calc(var(--nav-lo) + 20px)}}
.q-card{background:var(--paper);border:1px solid var(--hair);border-radius:var(--r-lg);padding:clamp(24px,2.6vw,32px);box-shadow:var(--shadow-sm)}
.q-steps{display:grid;gap:16px}
.q-steps li{display:flex;gap:14px;align-items:flex-start}
.q-steps b{display:grid;place-items:center;flex:0 0 auto;width:32px;height:32px;border-radius:10px;background:var(--yellow);color:var(--ink);font-weight:900;font-size:.86rem}
.q-steps strong{display:block;font-size:.95rem}
.q-steps span{display:block;margin-top:4px;color:var(--steel);font-size:.88rem;line-height:1.55}
.q-card-dark{background:var(--ink-900);border-color:transparent;color:#fff;position:relative;overflow:hidden;isolation:isolate}
.q-card-dark::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;background:repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 1px,transparent 1px 20px)}
.q-card-dark .kicker{color:var(--yellow)}
.q-aside-actions{display:grid;gap:10px;margin-top:22px}

.feat-grid-3{grid-template-columns:repeat(3,1fr)}

@media (max-width:1080px){
  .q-layout{grid-template-columns:1fr}
  .q-aside{position:static}
  .feat-grid-3{grid-template-columns:1fr}
}
@media (max-width:640px){.q-actions{grid-template-columns:1fr}}


/* Título do processo centralizado */
.request-process-title{max-width:900px!important;margin-inline:auto!important;text-align:center!important}
.request-process-title h2{text-align:center!important}


/* v20260730-7 — cartões auxiliares acima do formulário */
.q-layout{grid-template-columns:1fr}
.q-layout>.q-aside{order:0;display:grid;grid-template-columns:1fr 1fr;position:static}
.q-layout>.q-form{order:1}
@media(max-width:760px){.q-layout>.q-aside{grid-template-columns:1fr}}

/* v20260730-8 — tipografia alinhada à Home e cabeçalho do processo centralizado */
.page-orcamentos{
  --orcamentos-title-font:var(--font-display,var(--font-heading,var(--font-title,var(--font-serif,var(--serif,Georgia,"Times New Roman",serif)))))
}
.page-orcamentos :is(h1,h2,h3,h4,h5,h6,.h-lg,.q-legend,.q-steps strong){
  font-family:var(--orcamentos-title-font)!important
}
.section-request-process .sec-head{
  width:100%;
  display:flex;
  justify-content:center;
  text-align:center
}
.section-request-process .request-process-title{
  width:100%;
  max-width:900px!important;
  margin-inline:auto!important;
  text-align:center!important
}
.section-request-process .request-process-title h2,
.section-request-process .request-process-title p{
  text-align:center!important;
  margin-inline:auto!important
}
.section-request-process .request-process-title p{
  max-width:760px
}

/* ========================================================================
   v20260730-9 — ajustes visuais solicitados
   - mesma tipografia dos títulos da Home;
   - conteúdo do banner centralizado;
   - cabeçalho e títulos dos blocos do processo centralizados.
   ======================================================================== */
.page-orcamentos{
  --orcamentos-title-font: Georgia, "Times New Roman", Times, serif;
}

/* Mesma tipografia leve utilizada nos títulos da Home. */
.page-orcamentos :where(h1,h2,h3,h4,h5,h6,.display,.h-xl,.h-lg,.q-legend,.q-steps strong,.brands-title){
  font-family:var(--orcamentos-title-font)!important;
  font-weight:400!important;
  font-style:normal!important;
  letter-spacing:-.018em!important;
}
.page-orcamentos :where(h1,h2,h3,h4,h5,h6,.display,.h-xl,.h-lg,.q-legend,.q-steps strong,.brands-title) :where(strong,b){
  font-weight:400!important;
}

/* Banner: título, texto e conjunto de botões no centro. */
.page-orcamentos .phero > .container{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  text-align:center!important;
}
.page-orcamentos .phero :where(h1,.lead){
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
.page-orcamentos .phero h1{
  max-width:22ch!important;
}
.page-orcamentos .phero .lead{
  max-width:760px!important;
}
.page-orcamentos .phero .actions{
  width:100%!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  text-align:center!important;
}

/* Cabeçalho "O que acontece com a sua solicitação". */
.page-orcamentos .section-request-process .sec-head{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  width:100%!important;
  text-align:center!important;
}
.page-orcamentos .section-request-process .request-process-title{
  width:100%!important;
  max-width:900px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
.page-orcamentos .section-request-process .request-process-title :where(h2,p){
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
.page-orcamentos .section-request-process .request-process-title h2{
  max-width:22ch!important;
}
.page-orcamentos .section-request-process .request-process-title p{
  max-width:760px!important;
}

/* Centraliza os títulos dos três blocos da mesma linha. */
.page-orcamentos .section-request-process .feat h3{
  width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

@media (max-width:640px){
  .page-orcamentos .phero .actions{
    flex-direction:column!important;
  }
}


/* ========================================================================
   v20260730-10 — processo mais elaborado e envio único do formulário
   ======================================================================== */
.q-actions-single{
  grid-template-columns:1fr!important;
}
.quote-form-hint{
  margin-top:14px;
  text-align:center;
}

/* Linha visual que conecta as três etapas sem pesar no layout. */
.process-grid{
  position:relative;
  isolation:isolate;
  gap:clamp(18px,2.4vw,28px);
}
.process-grid::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:42px;
  left:15%;
  right:15%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(245,196,0,.62) 18%,rgba(245,196,0,.62) 82%,transparent);
}

.page-orcamentos .section-request-process .process-card{
  position:relative;
  overflow:hidden;
  min-height:100%;
  padding:clamp(24px,2.8vw,34px);
  border:1px solid rgba(16,19,26,.11);
  border-radius:20px;
  background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.93) 100%);
  box-shadow:0 12px 34px rgba(16,19,26,.07);
  text-align:center;
  cursor:default;
  transition:transform .24s var(--ease),box-shadow .24s var(--ease),border-color .24s var(--ease);
}
.page-orcamentos .section-request-process .process-card::before{
  content:"";
  position:absolute;
  top:0;
  left:24%;
  right:24%;
  height:3px;
  border-radius:0 0 999px 999px;
  background:var(--yellow);
  transform:scaleX(.55);
  transform-origin:center;
  transition:transform .24s var(--ease);
}
.page-orcamentos .section-request-process .process-card::after{
  content:"";
  position:absolute;
  width:92px;
  height:92px;
  right:-48px;
  bottom:-54px;
  border-radius:50%;
  background:rgba(245,196,0,.10);
  transition:transform .24s var(--ease);
}
.page-orcamentos .section-request-process .process-card:hover,
.page-orcamentos .section-request-process .process-card:focus-visible{
  transform:translateY(-6px);
  border-color:rgba(245,196,0,.8);
  box-shadow:0 20px 44px rgba(16,19,26,.12);
  outline:none;
}
.page-orcamentos .section-request-process .process-card:hover::before,
.page-orcamentos .section-request-process .process-card:focus-visible::before{
  transform:scaleX(1);
}
.page-orcamentos .section-request-process .process-card:hover::after,
.page-orcamentos .section-request-process .process-card:focus-visible::after{
  transform:scale(1.16);
}
.process-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:20px;
}
.process-step{
  font-family:Manrope,Arial,sans-serif;
  font-size:.72rem;
  line-height:1;
  font-weight:800;
  letter-spacing:.14em;
  color:var(--steel);
}
.process-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:16px;
  background:var(--yellow);
  color:var(--ink);
  box-shadow:0 9px 20px rgba(245,196,0,.22);
  transition:transform .24s var(--ease);
}
.process-card:hover .process-icon,
.process-card:focus-visible .process-icon{
  transform:rotate(-3deg) scale(1.05);
}
.process-icon svg{
  width:25px;
  height:25px;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.page-orcamentos .section-request-process .process-card h3{
  margin:0 0 12px!important;
  font-size:clamp(1.38rem,2vw,1.72rem);
  line-height:1.12;
}
.page-orcamentos .section-request-process .process-card p{
  margin:0 auto;
  max-width:37ch;
  color:var(--steel);
  line-height:1.68;
  text-align:center;
}
.process-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:22px;
  padding:8px 12px;
  border:1px solid rgba(16,19,26,.09);
  border-radius:999px;
  background:var(--paper-2);
  color:var(--ink);
  font-family:Manrope,Arial,sans-serif;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.03em;
}
.process-status::before{
  content:"";
  width:7px;
  height:7px;
  margin-right:8px;
  border-radius:50%;
  background:var(--yellow);
  box-shadow:0 0 0 4px rgba(245,196,0,.14);
}

@media(max-width:1080px){
  .process-grid::before{display:none}
}
@media(prefers-reduced-motion:reduce){
  .page-orcamentos .section-request-process .process-card,
  .page-orcamentos .section-request-process .process-card::before,
  .page-orcamentos .section-request-process .process-card::after,
  .process-icon{transition:none!important}
  .page-orcamentos .section-request-process .process-card:hover,
  .page-orcamentos .section-request-process .process-card:focus-visible{transform:none}
}


/* ========================================================================
   v20260804 — modal de confirmação do formulário de Orçamentos
   ======================================================================== */
body.quote-modal-open{
  overflow:hidden;
}
.quote-success-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:center;
  padding:24px;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:opacity .22s ease,visibility .22s ease;
}
.quote-success-modal.is-visible{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}
.quote-success-backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,7,12,.64);
  backdrop-filter:blur(1.5px);
}
.quote-success-dialog{
  position:relative;
  z-index:1;
  width:min(100%,575px);
  min-height:420px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:52px 54px 42px;
  overflow:hidden;
  border-top:6px solid #f5c400;
  border-radius:24px;
  background:#fff;
  box-shadow:0 30px 90px rgba(0,0,0,.28);
  text-align:center;
  transform:translateY(14px) scale(.985);
  transition:transform .24s ease;
}
.quote-success-modal.is-visible .quote-success-dialog{
  transform:translateY(0) scale(1);
}
.quote-success-close{
  position:absolute;
  top:16px;
  right:16px;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:#f1f2f4;
  color:#16202d;
  font:700 34px/1 Arial,sans-serif;
  cursor:pointer;
  transition:background .2s ease,transform .2s ease;
}
.quote-success-close span{
  display:block;
  margin-top:-3px;
}
.quote-success-close:hover,
.quote-success-close:focus-visible{
  background:#e5e7ea;
  transform:scale(1.04);
  outline:none;
}
.quote-success-icon{
  width:82px;
  height:82px;
  display:grid;
  place-items:center;
  margin:0 0 24px;
  border-radius:50%;
  background:#f5c400;
  color:#05070c;
}
.quote-success-icon svg{
  width:52px;
  height:52px;
}
.quote-success-icon path{
  stroke:currentColor;
  stroke-width:5;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.quote-success-dialog h2{
  margin:0 0 18px;
  color:#090b10;
  font-family:Georgia,"Times New Roman",Times,serif!important;
  font-size:clamp(38px,5vw,48px);
  font-weight:400!important;
  line-height:1.08;
  letter-spacing:-.03em!important;
}
.quote-success-dialog p{
  max-width:410px;
  margin:0 0 30px;
  color:#626e7d;
  font-size:20px;
  line-height:1.6;
}
.quote-success-confirm{
  min-width:200px;
  min-height:60px;
  padding-inline:34px;
  border-radius:999px;
  font-size:17px;
  font-weight:800;
  box-shadow:0 16px 34px rgba(245,196,0,.24);
}

/* A confirmação de sucesso acontece apenas no modal. O feedback abaixo do
   formulário fica reservado para mensagens de erro. */
.page-orcamentos .form-feedback:empty{
  display:none!important;
}
.page-orcamentos .form-feedback.is-ok,
.page-orcamentos .form-feedback.ok{
  display:none!important;
}

@media (max-width:640px){
  .quote-success-modal{padding:16px}
  .quote-success-dialog{
    min-height:390px;
    padding:48px 24px 34px;
    border-radius:20px;
  }
  .quote-success-close{
    top:12px;
    right:12px;
    width:44px;
    height:44px;
  }
  .quote-success-icon{
    width:74px;
    height:74px;
    margin-bottom:22px;
  }
  .quote-success-dialog h2{font-size:38px}
  .quote-success-dialog p{font-size:17px;line-height:1.55}
  .quote-success-confirm{width:min(100%,240px)}
}

@media (prefers-reduced-motion:reduce){
  .quote-success-modal,
  .quote-success-dialog,
  .quote-success-close{transition:none!important}
}
