/* Componentes reutilizáveis */
.glass{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);-webkit-backdrop-filter:blur(24px) saturate(140%);backdrop-filter:blur(24px) saturate(140%)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:rgba(16,24,31,.72)}}

.btn{--lift:0px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 28px;border-radius:999px;border:1.5px solid transparent;font-weight:700;font-size:1rem;line-height:1.35;white-space:nowrap;
  transform:translateY(var(--lift)) scale(1);transition:transform .16s var(--ease-out),box-shadow .2s var(--ease-out),background-color .2s ease,border-color .2s ease}
.btn .i{width:1.1em;height:1.1em;stroke-width:2.2;transition:transform .2s var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn--primary{background:var(--cyan-600);color:#fff;box-shadow:0 10px 26px -8px rgba(10,135,166,.55)}
.btn--whatsapp{background:#0f8f48;color:#fff;box-shadow:0 10px 26px -8px rgba(15,143,72,.42)}
.btn--whatsapp .i{stroke-width:2.2}
.btn--glass{color:#fff}
.btn--outline{border-color:rgba(10,37,64,.3);color:var(--navy)}
@media (hover:hover) and (pointer:fine){
  .btn:hover{--lift:-2px}
  .btn:hover .i{transform:translateX(4px)}
  .btn--primary:hover{background:var(--cyan-700);box-shadow:0 16px 32px -10px rgba(10,135,166,.65)}
  .btn--whatsapp:hover{background:#0c773b;box-shadow:0 16px 32px -10px rgba(15,143,72,.5)}
  .btn--glass:hover{background:rgba(255,255,255,.26)}
  .btn--outline:hover{border-color:var(--cyan-600);color:var(--cyan-700)}
}

.logo{display:inline-flex;align-items:center;gap:14px;color:#fff;transition:color .25s ease}
.logo__mark{width:44px;height:44px;border:2px solid currentColor;border-radius:6px;display:grid;place-items:center}
.logo__mark .i{width:28px;height:28px;stroke-width:2}
.logo__image{display:block;width:clamp(148px,15vw,176px);height:auto;max-height:42px;object-fit:contain}
.logo__text{display:grid;gap:3px;padding-left:14px;border-left:1.5px solid color-mix(in srgb,currentColor 60%,transparent);line-height:1}
.logo__text b{font-size:1.5rem;font-weight:800;letter-spacing:.12em}
.logo__text small{font-size:.5625rem;font-weight:700;letter-spacing:.4em}

.card{display:flex;flex-direction:column;padding:12px;border-radius:28px;background:rgba(255,255,255,.72);border:1px solid var(--border);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 14px 40px -14px rgba(10,37,64,.12);
  transition:transform .32s var(--ease-out),box-shadow .32s var(--ease-out),border-color .32s ease}
.card__media{aspect-ratio:386/220;border-radius:20px;background:linear-gradient(160deg,var(--cyan-100),#EAF8FB);display:grid;place-items:center;color:var(--cyan-600);overflow:hidden}
.card__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.card__body{padding:22px 12px 10px;display:grid;gap:8px}
.card__body p{color:var(--muted);font-size:1rem;line-height:1.55}
.card__link{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-weight:700;font-size:.9375rem;color:var(--cyan-600);width:fit-content}
.card__link .i{width:1em;height:1em;stroke-width:2.2;transition:transform .2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .card:hover{transform:translateY(-6px);border-color:var(--cyan-300);box-shadow:0 26px 50px -18px rgba(10,135,166,.28)}
  .card:hover .card__media img{transform:scale(1.04)}
  .card:hover .card__link .i{transform:translateX(4px)}
}

.pillar{padding:28px;border-radius:26px;display:grid;gap:12px;color:#fff;background:rgba(255,255,255,.14);transition:transform .3s var(--ease-out),background-color .3s ease}
.pillar__icon{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--cyan-700);display:grid;place-items:center}
.pillar p{color:rgba(255,255,255,.9);font-size:1rem;line-height:1.55}
@media (hover:hover) and (pointer:fine){.pillar:hover{transform:translateX(6px);background:rgba(255,255,255,.2)}}

.brand{height:96px;border-radius:22px;display:grid;place-items:center;background:rgba(255,255,255,.7);border:1px solid var(--border);color:var(--muted);font-size:.875rem;font-weight:600;box-shadow:0 10px 28px -14px rgba(10,37,64,.14);transition:transform .3s var(--ease-out),border-color .3s ease}
@media (hover:hover) and (pointer:fine){.brand:hover{transform:translateY(-4px);border-color:var(--cyan-300)}}

.field{display:grid;gap:8px}
.field label,.field legend{font-size:.875rem;font-weight:700;color:var(--navy)}
.field input,.field textarea{width:100%;padding:15px 18px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.95);outline:none;transition:border-color .2s ease,box-shadow .2s ease}
.field textarea{min-height:112px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:rgba(74,91,107,.8)}
.field input:focus,.field textarea:focus{border-color:var(--cyan-600);box-shadow:0 0 0 4px rgba(10,135,166,.16)}
.field [aria-invalid=true]{border-color:#C0392B}

.seg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:var(--cyan-100)}
.seg::before{content:"";position:absolute;inset:4px auto 4px 4px;width:calc(50% - 4px);border-radius:999px;background:#fff;box-shadow:0 4px 12px rgba(10,37,64,.12);transition:transform .24s var(--ease-io)}
.seg:has(input[value=catalogo]:checked)::before{transform:translateX(100%)}
.seg label{position:relative;text-align:center;padding:12px 8px;border-radius:999px;font-weight:700;font-size:.9375rem;color:var(--cyan-700);cursor:pointer;transition:color .2s ease}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg input:checked+label{color:var(--navy)}
.seg input:focus-visible+label{outline:3px solid var(--cyan-300)}

.review{position:relative;display:flex;gap:20px;padding:28px;border-radius:20px;background:#fff;border:1px solid var(--border);box-shadow:0 14px 40px -18px rgba(10,37,64,.16);transition:transform .32s var(--ease-out),box-shadow .32s var(--ease-out)}
.review::after{content:"\201D";position:absolute;top:8px;right:24px;font:800 5rem/1 Georgia,serif;color:var(--cyan-100);pointer-events:none}
.review__photo{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;background:var(--cyan-100)}
.review__body{display:grid;gap:4px;min-width:0;align-content:start}
.review h3{font-size:1rem;color:var(--cyan-600);letter-spacing:0}
.review__role{font-size:.8125rem;color:var(--muted);line-height:1.3}
.review__stars{display:flex;gap:2px;color:#F5A623;margin:6px 0 8px}
.review__stars .i{width:16px;height:16px;stroke:none}
.review blockquote{margin:0;color:var(--muted);font-size:.9375rem;line-height:1.65;text-wrap:pretty}
@media (hover:hover) and (pointer:fine){.review:hover{transform:translateY(-4px);box-shadow:0 24px 50px -20px rgba(10,135,166,.3)}}

