/* KonectaCon · Camada responsiva universal v1.0
   Escala fluida para celulares, tablets, notebooks, desktops e monitores amplos. */

:root{
  --kc-page-max: 1920px;
  --kc-reading-max: 1180px;
  --kc-gutter: clamp(16px, 3.4vw, 72px);
  --kc-section-y: clamp(48px, 6vw, 108px);
  --kc-radius-lg: clamp(18px, 1.8vw, 32px);
}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  font-size:clamp(14px, .22vw + 12px, 18px);
}
body{min-width:320px;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}
input,select,textarea,button{max-width:100%}

/* Landing principal */
.container{
  width:min(100%, var(--kc-page-max)) !important;
  max-width:var(--kc-page-max) !important;
  margin-inline:auto !important;
  padding-inline:var(--kc-gutter) !important;
}
.nav{height:clamp(70px,5vw,92px) !important}
.word{font-size:clamp(19px,1.15vw,27px) !important}
nav{gap:clamp(14px,1.45vw,30px) !important;font-size:clamp(12px,.65vw,15px) !important}
.btn,button{font-size:clamp(12px,.62vw,15px);min-height:clamp(42px,2.5vw,50px)}
.hero{padding-block:clamp(58px,7vw,128px) !important}
.hero-grid{gap:clamp(32px,5vw,104px) !important}
.hero h1{font-size:clamp(42px,5.4vw,96px) !important;letter-spacing:clamp(-4px,-.23vw,-1.5px) !important}
.subtitle{font-size:clamp(16px,1vw,22px) !important;line-height:1.65 !important}
.section{padding-block:var(--kc-section-y) !important}
.section h2{font-size:clamp(32px,3.6vw,68px) !important}
.section p{font-size:clamp(15px,.9vw,20px) !important}
.module-grid,.steps{gap:clamp(14px,1.4vw,28px) !important}
.module-grid article,.steps div{padding:clamp(20px,1.7vw,34px) !important}
.cta{padding:clamp(24px,3.2vw,58px) !important;gap:clamp(28px,3vw,60px) !important}

/* Hangar 02: página inicial */
.h2-top{height:clamp(64px,4.6vw,82px) !important}
.h2-nav{
  width:min(100%,var(--kc-page-max)) !important;
  margin-inline:auto !important;
  padding-inline:var(--kc-gutter) !important;
  grid-template-columns:minmax(220px,320px) minmax(0,1fr) minmax(190px,270px) !important;
  gap:clamp(14px,2vw,38px) !important;
}
.h2-brand img{width:clamp(38px,2.6vw,54px) !important;height:clamp(38px,2.6vw,54px) !important}
.h2-brand strong{font-size:clamp(18px,1.25vw,26px) !important}
.h2-brand small{font-size:clamp(10px,.62vw,14px) !important}
.h2-links{gap:clamp(16px,1.65vw,34px) !important}
.h2-links a{font-size:clamp(12px,.72vw,16px) !important;padding-block:clamp(21px,1.55vw,30px) !important}
.h2-hero{min-height:clamp(500px,39vw,760px) !important}
.h2-hero-inner{
  width:min(100%,var(--kc-page-max)) !important;
  margin-inline:auto !important;
  padding-inline:var(--kc-gutter) !important;
  padding-block:clamp(38px,4.8vw,90px) !important;
}
.h2-hero h1{font-size:clamp(52px,5.1vw,104px) !important;line-height:.92 !important;letter-spacing:clamp(-5px,-.28vw,-2px) !important}
.h2-subtitle{font-size:clamp(15px,.92vw,21px) !important;line-height:1.55 !important}
.h2-search{max-width:clamp(520px,37vw,780px) !important}
.h2-stats{max-width:clamp(520px,37vw,780px) !important}
.h2-grid{
  width:min(100%,var(--kc-page-max)) !important;
  margin-inline:auto !important;
  padding-inline:var(--kc-gutter) !important;
}
.h2-cards{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:clamp(14px,1.35vw,28px) !important}
.h2-card{min-width:0 !important;padding:clamp(18px,1.35vw,30px) !important;border-radius:var(--kc-radius-lg) !important}
.h2-card-main h3{font-size:clamp(18px,1.12vw,25px) !important}
.h2-card-main p{font-size:clamp(13px,.72vw,16px) !important;line-height:1.5 !important}
.h2-card-meta{font-size:clamp(10px,.6vw,13px) !important;gap:clamp(8px,.8vw,16px) !important;flex-wrap:wrap !important}
.h2-foot{font-size:clamp(12px,.7vw,15px) !important}

/* Categorias do Hangar 02 */
.wrap,.hero-inner,.content{
  width:min(100%,var(--kc-page-max)) !important;
  max-width:var(--kc-page-max) !important;
  margin-inline:auto !important;
  padding-inline:var(--kc-gutter) !important;
}
.top .wrap,.nav .wrap{min-height:clamp(66px,4.5vw,82px) !important}
.hero{min-height:auto}
.hero-inner{padding-block:clamp(44px,5vw,96px) !important}
.hero-inner h1{font-size:clamp(38px,4.1vw,78px) !important;line-height:1 !important}
.hero-inner .lead,.hero-inner>p{font-size:clamp(15px,.95vw,21px) !important;line-height:1.6 !important;max-width:75ch !important}
.content{padding-block:clamp(34px,4.2vw,78px) !important}
.box,.callout,.cta,.side{border-radius:var(--kc-radius-lg) !important;padding:clamp(20px,2vw,38px) !important}
.box h2,.section-head h2{font-size:clamp(24px,2vw,40px) !important}
.box p,.callout p,.side p,.content p{font-size:clamp(14px,.8vw,18px);line-height:1.65}
.steps,.callouts,.quick{gap:clamp(12px,1.2vw,24px) !important}

/* Download manager e modais */
.dm-grid{gap:clamp(12px,1vw,20px) !important}
.dm-card{min-height:clamp(96px,6.4vw,126px) !important;padding:clamp(16px,1.2vw,24px) clamp(48px,3.2vw,68px) clamp(16px,1.2vw,24px) clamp(72px,5.2vw,98px) !important}
.dm-card-icon{left:clamp(16px,1.25vw,24px) !important;top:clamp(16px,1.25vw,24px) !important;width:clamp(44px,2.8vw,58px) !important;height:clamp(44px,2.8vw,58px) !important}
.dm-card-title{font-size:clamp(16px,1vw,21px) !important}
.dm-card-desc{font-size:clamp(12px,.75vw,16px) !important}
.dm-modal{width:min(94vw,1120px) !important;max-height:min(94dvh,980px) !important;border-radius:clamp(18px,1.8vw,30px) !important}
.dm-hero{padding:clamp(24px,2.5vw,44px) !important}
.dm-hero h2{font-size:clamp(30px,2.8vw,50px) !important}
.dm-hero p{font-size:clamp(14px,.85vw,18px) !important}
.dm-body{padding:clamp(18px,2vw,34px) !important}
.dm-form-grid{gap:clamp(10px,.9vw,18px) !important}
.dm-field label{font-size:clamp(12px,.7vw,15px) !important}
.dm-field input,.dm-field select{height:clamp(46px,3vw,56px) !important;font-size:clamp(14px,.78vw,17px) !important}
.dm-social-follow{max-width:960px !important;padding:clamp(18px,2vw,30px) !important}
.dm-social-follow strong{font-size:clamp(23px,1.7vw,32px) !important}
.dm-social-card{min-height:clamp(88px,6.2vw,120px) !important;padding:clamp(14px,1.2vw,22px) !important;grid-template-columns:clamp(54px,3.8vw,72px) minmax(0,1fr) auto !important}
.dm-social-icon{width:clamp(52px,3.6vw,68px) !important;height:clamp(52px,3.6vw,68px) !important}
.dm-social-card b{font-size:clamp(16px,1vw,20px) !important}
.dm-social-card small{font-size:clamp(11px,.7vw,14px) !important}

/* Modal específico Criando um Conselho */
.lead-modal-panel{width:min(94vw,1120px) !important;max-height:94dvh !important;border-radius:clamp(18px,1.8vw,30px) !important;overflow:auto !important}
.lead-modal-hero{padding:clamp(24px,2.5vw,44px) !important}
.lead-modal-body{padding:clamp(18px,2vw,34px) !important}
.lead-form-grid{gap:clamp(10px,.9vw,18px) !important}
.lead-social-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:clamp(12px,1.2vw,20px) !important}
.lead-social-card{min-width:0 !important}

/* Faixas intermediárias */
@media (max-width: 1280px){
  .h2-nav{grid-template-columns:minmax(210px,270px) minmax(0,1fr) auto !important}
  .h2-links{gap:16px !important}
  .h2-cards{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
  .module-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

@media (max-width: 980px){
  .container,.wrap,.hero-inner,.content,.h2-hero-inner,.h2-grid{padding-inline:clamp(18px,4vw,36px) !important}
  .hero-grid,.split,.cta{grid-template-columns:1fr !important}
  .h2-nav{grid-template-columns:minmax(0,1fr) auto auto !important}
  .h2-links{display:none !important}
  .h2-cards{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .h2-hero{min-height:560px !important;background-position:62% center !important}
  .h2-hero-inner{align-items:flex-start !important}
  .h2-hero-inner>*{max-width:min(72%,680px) !important}
  .dm-modal,.lead-modal-panel{width:min(96vw,860px) !important}
}

@media (max-width: 760px){
  html{font-size:16px}
  .container,.wrap,.hero-inner,.content,.h2-hero-inner,.h2-grid{padding-inline:16px !important}
  .topbar,.h2-top{position:sticky}
  .hero{padding-block:48px !important}
  .hero h1{font-size:clamp(38px,12vw,58px) !important;line-height:.98 !important}
  .section{padding-block:54px !important}
  .module-grid,.steps,.proof-grid,.security-list{grid-template-columns:1fr !important}
  .h2-nav{padding-inline:14px !important;gap:8px !important}
  .h2-brand{gap:8px !important;min-width:0}
  .h2-brand img{width:38px !important;height:38px !important}
  .h2-brand strong{font-size:17px !important}
  .h2-brand small{font-size:9px !important;letter-spacing:.18em !important}
  .h2-actions{gap:7px !important}
  .h2-back{font-size:0 !important;padding:0 !important;width:42px !important;height:42px !important;min-width:42px !important}
  .h2-back::before{content:'←';font-size:20px}
  .h2-hero{min-height:auto !important;background-position:68% center !important}
  .h2-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 58%,rgba(255,255,255,.35) 100%);pointer-events:none}
  .h2-hero-inner{position:relative;padding-block:42px 56px !important}
  .h2-hero-inner>*{max-width:100% !important}
  .h2-hero h1{font-size:clamp(46px,14vw,68px) !important}
  .h2-search,.h2-stats{max-width:100% !important}
  .h2-stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .h2-cards{grid-template-columns:1fr !important}
  .h2-card{padding:18px !important}
  .h2-card-main{min-width:0 !important}
  .h2-card-main h3{font-size:20px !important}
  .h2-card-main p{font-size:14px !important}
  .dm-grid,.dm-form-grid,.lead-form-grid,.lead-social-grid{grid-template-columns:1fr !important}
  .dm-overlay{padding:8px !important;align-items:flex-start !important;overflow:auto !important}
  .dm-modal,.lead-modal-panel{width:100% !important;max-height:none !important;border-radius:18px !important;margin-block:8px !important}
  .dm-hero,.lead-modal-hero{border-radius:18px 18px 0 0 !important;padding:22px 18px !important}
  .dm-close,.lead-modal-close{width:42px !important;height:42px !important;right:12px !important;top:12px !important}
  .dm-hero h2{font-size:30px !important;padding-right:44px}
  .dm-body,.lead-modal-body{padding:16px !important}
  .dm-toolbar{flex-direction:column !important;align-items:stretch !important}
  .dm-actions{display:grid !important;grid-template-columns:1fr !important}
  .dm-social-links{grid-template-columns:1fr !important}
  .dm-social-card{min-height:88px !important;grid-template-columns:56px minmax(0,1fr) 20px !important}
  .footer-premium-main,.footer-premium-bottom{grid-template-columns:1fr !important}
}

@media (max-width: 420px){
  .h2-stats{grid-template-columns:1fr !important}
  .h2-suggestions{gap:7px !important}
  .h2-chip{font-size:11px !important;padding:8px 10px !important}
  .dm-card{padding:16px 46px 16px 68px !important}
  .dm-card-icon{width:40px !important;height:40px !important;left:14px !important;top:16px !important}
  .dm-card-check{right:12px !important;top:14px !important}
}

/* Monitores grandes: cresce com limite, sem parecer uma miniatura no centro */
@media (min-width: 1920px){
  :root{--kc-page-max:2160px;--kc-gutter:clamp(72px,5vw,128px)}
  html{font-size:18px}
  .h2-cards{gap:28px !important}
  .h2-card{min-height:190px !important}
}

@media (min-width: 2560px){
  :root{--kc-page-max:2360px;--kc-gutter:128px}
  html{font-size:20px}
  .h2-hero{min-height:820px !important}
}

/* Ajuste fino do hero do portal: conteúdo novamente no canto esquerdo,
   sem cobrir a imagem da família. */
.h2-brand small,
.h2-chip{
  display:none !important;
}

@media (min-width: 981px){
  .h2-hero-inner{
    width:min(50%,760px) !important;
    max-width:760px !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:auto !important;
    padding-left:var(--kc-gutter) !important;
    padding-right:24px !important;
    padding-top:clamp(48px,4vw,76px) !important;
    padding-bottom:clamp(40px,3.4vw,64px) !important;
  }
  .h2-hero-inner > *{
    max-width:100% !important;
  }
  .h2-hero h1{
    font-size:clamp(58px,4.65vw,92px) !important;
  }
  .h2-search,
  .h2-stats{
    max-width:660px !important;
  }
}

@media (min-width: 1920px){
  .h2-hero-inner{
    width:min(46%,820px) !important;
    max-width:820px !important;
  }
  .h2-hero h1{
    font-size:clamp(68px,4.15vw,96px) !important;
  }
}


/* Modal responsiveness hardening */
.dm-overlay,.lead-modal{padding:clamp(10px,1.8vw,20px)!important}
.dm-modal,.lead-modal-panel{width:min(94vw,980px)!important;max-height:min(92dvh,880px)!important;overflow:auto!important}
.dm-hero,.lead-modal-hero{padding:clamp(22px,3vw,32px)!important}
.dm-hero h2,.lead-modal-panel h2{font-size:clamp(26px,3.2vw,38px)!important;line-height:1.02!important}
.dm-body,.lead-modal-body{padding:clamp(16px,2.2vw,28px)!important}
@media (max-height: 860px){.dm-overlay,.lead-modal{align-items:flex-start!important;overflow:auto!important}.dm-modal,.lead-modal-panel{margin-block:8px!important;max-height:none!important}.dm-hero,.lead-modal-hero{padding:20px!important}.dm-body,.lead-modal-body{padding:16px!important}.dm-form-grid,.lead-form-grid{grid-template-columns:1fr!important}.lead-social-grid{grid-template-columns:1fr!important}}
@media (max-width: 900px){.dm-modal,.lead-modal-panel{width:min(96vw,860px)!important}.dm-form-grid,.lead-form-grid{grid-template-columns:1fr!important}}


/* FINAL: compactação responsiva visível para todos os modais */
.dm-overlay,.lead-modal{padding:12px !important;align-items:center !important;overflow:auto !important}
.dm-modal,.lead-modal-panel{width:min(90vw,940px) !important;max-height:calc(100dvh - 24px) !important;overflow:auto !important;margin:0 !important;border-radius:22px !important}
.dm-hero,.lead-modal-hero{padding:22px 24px !important}
.dm-hero h2,.lead-modal-panel h2{font-size:clamp(26px,2.8vw,36px) !important;margin-top:4px !important;margin-bottom:8px !important}
.dm-hero p,.lead-modal-subtitle{font-size:14px !important;line-height:1.4 !important}
.dm-body,.lead-modal-body{padding:16px 20px 20px !important}
.dm-form-grid,.lead-form-grid{gap:9px 12px !important}
.dm-field input,.dm-field select,.lead-form-grid input,.lead-form-grid select{height:42px !important}
.dm-selected,.lead-selected{margin-bottom:12px !important;padding:10px 12px !important}
.dm-consent,.lead-consent{margin:10px 0 !important}
.dm-submit,.lead-submit{min-height:48px !important;padding:11px 16px !important}
@media(max-height:820px){.dm-overlay,.lead-modal{align-items:flex-start !important}.dm-modal,.lead-modal-panel{max-height:none !important;margin:6px 0 !important}.dm-form-grid,.lead-form-grid{grid-template-columns:1fr 1fr !important}.dm-hero,.lead-modal-hero{padding:18px 20px !important}.dm-body,.lead-modal-body{padding:14px 18px 18px !important}}
@media(max-width:760px){.dm-overlay,.lead-modal{padding:6px !important;align-items:flex-start !important}.dm-modal,.lead-modal-panel{width:100% !important;max-height:none !important;margin:6px 0 !important;border-radius:16px !important}.dm-form-grid,.lead-form-grid{grid-template-columns:1fr !important}.dm-hero,.lead-modal-hero{border-radius:16px 16px 0 0 !important}}


/* Notebook/Desktop compact modal scale (similar to 90% zoom) */
@media (min-width: 781px){
  .dm-overlay,.lead-modal{padding:10px!important}
  .dm-modal,.lead-modal-panel{width:min(82vw,860px)!important;max-height:calc(100dvh - 20px)!important;border-radius:20px!important;overflow:auto!important}
  .dm-hero,.lead-modal-hero{padding:18px 22px!important;border-radius:20px 20px 0 0!important}
  .dm-hero h2,.lead-modal-panel h2{font-size:clamp(24px,2.4vw,31px)!important;line-height:1.02!important;margin-top:4px!important;margin-bottom:8px!important}
  .dm-hero p,.lead-modal-subtitle{font-size:13px!important;line-height:1.38!important}
  .dm-close,.lead-modal-close{width:38px!important;height:38px!important;right:12px!important;top:12px!important;font-size:24px!important}
  .dm-body,.lead-modal-body{padding:14px 18px 18px!important}
  .dm-selected,.lead-selected{padding:10px 12px!important;margin:12px 0!important;border-radius:14px!important}
  .dm-form-grid,.lead-form-grid{gap:8px 12px!important}
  .dm-field label,.lead-form-grid label>span{font-size:12px!important;margin-bottom:4px!important}
  .dm-field input,.dm-field select,.lead-form-grid input,.lead-form-grid select{height:42px!important;font-size:14px!important}
  .lead-consent,.lead-interests label,.dm-consent{font-size:12px!important}
  .lead-submit,.dm-submit{min-height:48px!important;font-size:15px!important;padding-top:12px!important;padding-bottom:12px!important}
}


/* Close button visual fix */
.dm-close,.lead-modal-close{display:grid!important;place-items:center!important;padding:0!important;box-sizing:border-box!important;line-height:1!important;font-family:Arial,Helvetica,sans-serif!important;font-weight:700!important;text-indent:-9999px!important;overflow:hidden!important;position:absolute!important}
.dm-close::before,.lead-modal-close::before{content:"×";position:absolute;inset:0;display:grid;place-items:center;color:#10233a;font-size:28px;line-height:1;font-weight:700;text-indent:0}
@media (min-width: 781px){.dm-close::before,.lead-modal-close::before{font-size:26px}}


/* FINAL override: keep library/cadastro modals compact on notebooks */
@media (min-width: 781px){
  .dm-overlay,.lead-modal{padding:8px!important;align-items:center!important;justify-content:center!important;overflow:auto!important}
  .dm-modal,.lead-modal-panel{width:min(78vw,820px)!important;max-height:calc(100dvh - 16px)!important;overflow:auto!important;margin:0!important;border-radius:18px!important}
  .dm-hero,.lead-modal-hero{padding:16px 18px!important;border-radius:18px 18px 0 0!important}
  .dm-hero h2,.lead-modal-panel h2{font-size:28px!important;line-height:1!important;margin-top:3px!important;margin-bottom:7px!important}
  .dm-hero p,.lead-modal-subtitle{font-size:12px!important;line-height:1.35!important}
  .dm-close,.lead-modal-close{width:36px!important;height:36px!important;right:10px!important;top:10px!important}
  .dm-close::before,.lead-modal-close::before{font-size:24px!important}
  .dm-body,.lead-modal-body{padding:12px 16px 16px!important}
  .dm-form-grid,.lead-form-grid{grid-template-columns:1fr 1fr!important;gap:7px 10px!important}
  .dm-field label,.lead-form-grid label>span{font-size:11px!important;margin-bottom:3px!important}
  .dm-field input,.dm-field select,.lead-form-grid input,.lead-form-grid select{height:38px!important;font-size:13px!important;border-radius:10px!important}
  .dm-consent,.lead-consent,.lead-interests label{font-size:11px!important;line-height:1.3!important}
  .dm-submit,.lead-submit{min-height:44px!important;font-size:14px!important;padding:10px 14px!important}
}
@media (max-height:760px) and (min-width:781px){
  .dm-modal,.lead-modal-panel{width:min(76vw,790px)!important}
  .dm-hero,.lead-modal-hero{padding:14px 16px!important}
  .dm-hero h2,.lead-modal-panel h2{font-size:25px!important}
  .dm-body,.lead-modal-body{padding:10px 14px 14px!important}
  .dm-field input,.dm-field select,.lead-form-grid input,.lead-form-grid select{height:36px!important}
}
