/* Tokens do Design System Copan (copiados de copan-crm-vscode/tokens, sem alteração de valor).
   Gerado por _build/build.py. Não editar aqui: editar no DS e rodar o build. */

/* ---- colors.css ---- */
/* Values lifted verbatim from the Elementor Global Kit (.elementor-kit-12813).
   Elementor slot names are kept as comments so consumers can trace them back. */
:root{
  /* base palette */
  --copan-navy:#000066;            /* e-global-color-primary AND -secondary */
  --copan-white:#FFFFFF;           /* e-global-color-accent / 2914cdab */
  --copan-ink:#0D0D0D;             /* e-global-color-text / b0481bf */
  --copan-gray-700:#353535;        /* e-global-color-8cb4a03 — default body copy */
  --copan-gray-100:#F5F5F5;        /* e-global-color-06ccaa0 — page background */
  --copan-gray-150:#F2F2F2;        /* used directly on the services section */
  --copan-green:#21BC00;           /* e-global-color-8982b31 — success / WhatsApp */
  --copan-red:#E30613;             /* e-global-color-67d7bd3 — error / alert */
  /* legacy template browns, carried in the kit but unused on live pages */
  --copan-brown-900:#140701;
  --copan-brown-800:#1E120D;
  --copan-brown-700:#391A0D;

  /* semantic aliases */
  --brand-primary:var(--copan-navy);
  --brand-on-primary:var(--copan-white);
  --text-heading:var(--copan-ink);
  --text-body:var(--copan-gray-700);
  --text-muted:rgba(13,13,13,.62);
  --text-on-dark:var(--copan-white);
  --text-on-dark-muted:rgba(255,255,255,.67);   /* #FFFFFFAB, the topbar/footer tone */
  --text-link:var(--copan-navy);
  --text-link-hover:var(--copan-navy);
  --surface-page:var(--copan-gray-100);
  --surface-card:var(--copan-white);
  --surface-muted:var(--copan-gray-150);
  --surface-inverse:var(--copan-navy);
  --border-card:var(--copan-gray-100);
  --border-card-hover:var(--copan-navy);
  --border-hairline:rgba(221,221,221,.28);      /* #DDDDDD47, topbar list rules */
  --divider-color:var(--copan-navy);
  --feedback-success:var(--copan-green);
  --feedback-error:var(--copan-red);

  /* the two gradients the site actually uses */
  --gradient-hero:linear-gradient(212deg,var(--copan-navy) 0%,var(--copan-navy) 100%);
  --gradient-panel:linear-gradient(182deg,var(--copan-navy) 0%,var(--copan-navy) 100%);
  --gradient-badge:linear-gradient(128deg,var(--copan-navy) 0%,var(--copan-brown-700) 100%);
}

/* ---- typography.css ---- */
/* Type ramp from the Elementor kit. Sizes are the desktop values; the -md / -sm
   custom properties are the kit's 1024px and 767px breakpoint overrides. */
:root{
  --font-core:"Sora",sans-serif;           /* headings, body, UI — the brand typeface */
  --font-legacy:"Cairo",sans-serif;        /* what the live WordPress site still ships */
  --font-serif-display:"Hahmlet",serif;    /* kit "Primary" style, 600 / 1.1em */
  --font-alt:"Rubik",sans-serif;           /* kit "Secondary" style, 400 / 1.8em */
  --font-icon:"geracao1";

  --weight-regular:400;
  --weight-medium:600;
  --weight-bold:700;

  /* display / hero */
  --text-display:70px;      --text-display-md:52px;  --text-display-sm:40px;
  --text-hero:45px;                                  /* homepage h1 override */
  --text-h1:48.83px;                                 --text-h1-sm:39.81px;
  --text-h2:39.06px;                                 --text-h2-sm:33.18px;
  --text-h3:31.25px;                                 --text-h3-sm:27.65px;
  --text-h4:25px;                                    --text-h4-sm:23.04px;
  --text-h5:20px;                                    --text-h5-sm:19.2px;
  --text-h6:16px;
  --text-body-lg:20px;
  --text-body:17px;
  --text-body-sm:16px;
  --text-accent:14px;                                /* buttons, labels, nav, eyebrows */
  --text-meta:13px;                                  /* topbar contact strip */

  --leading-display:1.3em;
  --leading-tight:1.1em;
  --leading-heading:1.3em;
  --leading-heading-sm:1.4em;
  --leading-title:1.5em;
  --leading-body:1.8em;
  --leading-lead:1.6em;

  --tracking-display:-1px;
  --tracking-h2:-0.8px;
  --tracking-none:0px;

  --case-accent:uppercase; /* @kind other */
  /* kit default; the live homepage overrides h1/h2 to none */
  --case-heading:capitalize; /* @kind other */
}

/* ---- spacing.css ---- */
:root{
  /* Elementor's own rhythm: widget gap 20px, section padding in em, container caps in px */
  --space-1:5px;
  --space-2:10px;
  --space-3:15px;
  --space-4:20px;      /* --widgets-spacing */
  --space-5:30px;
  --space-6:40px;
  --space-7:64px;      /* 4em section padding */
  --space-8:80px;      /* 5em section padding */
  --space-9:96px;      /* 6em section padding */

  --section-padding-y:5em;
  --section-padding-x:2em;
  --card-padding:3em 2.5em;        /* service / post cards */
  --card-padding-lg:3em;           /* the three overlapping feature cards */
  --card-overlap:-120px;           /* feature row pulled over the hero */

  --container-max:1300px;          /* kit container */
  --container-section:1280px;      /* every section on the homepage */
  --container-md:1024px;
  --container-sm:767px;

  --header-nav-padding-y:46px;
  --topbar-padding:0.5em 2em;
  --header-padding:1em 2em;
}

/* ---- radii.css ---- */
:root{
  --radius-button:5px;
  --radius-badge:15px;
  --radius-card:20px;
  --radius-pill:1000px;
  --radius-circle:50%;
  /* the hero portrait's asymmetric mask, verbatim from the homepage */
  --radius-hero-portrait:800px 200px 600px 800px;
}

/* ---- elevation.css ---- */
:root{
  --shadow-header:0px 29px 28px 0px rgba(0,0,0,.04);
  --shadow-dropdown:0px 24px 28px 0px rgba(0,0,0,.05);
  --shadow-card:0px 0px 36px 0px rgba(0,0,0,.09);
  --shadow-card-raised:0px 0px 45px 0px rgba(0,0,0,.22);
  --border-width-card:3px;
  --border-width-hairline:1px;
  --border-width-button:2px;
}

/* ---- motion.css ---- */
:root{
  /* Elementor's defaults, which the site never overrides: no custom easing anywhere. */
  --duration-fast:.3s; /* @kind other */
  /* card border + radius transitions */
  --duration-slow:1s; /* @kind other */
  --ease-default:ease; /* @kind other */
  --transition-interactive:background var(--duration-fast),border var(--duration-fast),border-radius var(--duration-fast),box-shadow var(--duration-fast);
  --transition-card:background var(--duration-fast),border var(--duration-slow),border-radius var(--duration-slow),box-shadow var(--duration-slow);
  --transition-color:color var(--duration-fast),fill var(--duration-fast);
}

/* ---- app.css ---- */
/* Application (CRM) surface tokens. The marketing site has no dense-UI surface, so these
   extend the brand palette rather than transcribe it: navy is the only accent, the neutrals
   are Copan's own #F5F5F5 / #F2F2F2, and the two derived greys are noted below. */
:root{
  --app-ground:var(--copan-gray-100);
  --app-surface:var(--copan-white);
  --app-surface-2:var(--copan-gray-150);
  --app-surface-3:#EAEAF0;                 /* derived: navy tinted toward the page grey */
  --app-text:var(--copan-ink);
  --app-text-2:rgba(13,13,13,.72);
  --app-text-muted:rgba(13,13,13,.48);
  --app-border:rgba(0,0,102,.12);
  --app-border-strong:rgba(0,0,102,.24);
  --app-hover:rgba(0,0,102,.05);
  --app-active:rgba(0,0,102,.10);
  --app-accent:var(--copan-navy);
  --app-accent-soft:rgba(0,0,102,.10);

  --app-shadow:var(--shadow-card);
  --app-shadow-sm:0 2px 8px rgba(0,0,102,.06);

  --sidebar-w:244px;
  --topbar-h:60px;
  --kanban-col-w:280px;

  --radius-control:var(--radius-button);   /* 5px  — buttons, inputs, chips */
  --radius-tile:var(--radius-badge);       /* 15px — lead cards */
  --radius-panel:var(--radius-card);       /* 20px — columns, KPI cards, tables */
}

/* Dark theme: neutral greys carry the surfaces; navy is kept for details only
   (sidebar, primary buttons, chips). --app-accent lifts navy so it reads on grey. */

/* ---- Sora local (antes vinha do Google Fonts e bloqueava a renderização) ---- */
@font-face{font-family:"Sora";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/sora-latin.woff2") format("woff2");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:"Sora";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/sora-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ---- reserva com as medidas da Sora: evita o texto pular quando a fonte termina de carregar (CLS) ---- */
@font-face{font-family:"Sora Fallback";src:local("Arial"),local("Helvetica"),local("Roboto");size-adjust:111.1%;ascent-override:87.3%;descent-override:26.1%;line-gap-override:0%}
:root{--font-core:"Sora","Sora Fallback",sans-serif;}
/* ---- fontes locais (fonts.css do DS, só a Hahmlet usada nas citações) ---- */
@font-face{font-family:"Hahmlet";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/hahmlet-latin.woff2") format("woff2");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:"Hahmlet";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/hahmlet-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ---- raios do README (seção 4): campos 14px, cards 24px ---- */
:root{--radius-field:14px;--radius-card-lg:24px;}
/* ---- branco translúcido sobre o navy (derivado de --copan-white, para linhas e fundos em seções escuras) ---- */
:root{--white-a05:rgba(255,255,255,.05);--white-a07:rgba(255,255,255,.07);--white-a08:rgba(255,255,255,.08);--white-a12:rgba(255,255,255,.12);--white-a14:rgba(255,255,255,.14);}
