/* Conecta Frontend Shell — profile-neutral design tokens. */
:root {
  --cc-shell-page-max: 1180px;
  --cc-shell-page-gutter: 32px;
  --cc-shell-section-gap: 48px;
  --cc-shell-content-footer-gap: 84px;
  --cc-shell-content-entry-gap: 24px;
  --cc-shell-touch-target: 44px;
  --cc-shell-radius: 18px;
  --cc-shell-overlay: rgba(22, 36, 22, .46);
  --cc-shell-surface: rgba(255,255,255,.92);
  --cc-shell-border: rgba(78,110,50,.16);
  --cc-shell-primary: var(--conecta-primary, #4E6E32);
  --cc-shell-text: var(--conecta-text, #525751);
}

@media (max-width: 1199px) {
  :root { --cc-shell-page-gutter: 24px; }
}

@media (max-width: 860px) {
  :root { --cc-shell-content-entry-gap: 20px; }
}

@media (max-width: 767px) {
  :root {
    --cc-shell-page-gutter: 16px;
    --cc-shell-section-gap: 32px;
    --cc-shell-content-footer-gap: 52px;

    /* v2.58.8 — Mobile Composition Foundation.
     * These are opt-in primitives for Portal modules. They intentionally do
     * not override legacy typography or component geometry by selector. */
    --cc-shell-mobile-surface-padding: 16px;
    --cc-shell-mobile-surface-gap: 12px;
    --cc-shell-mobile-control-height: 44px;
    --cc-shell-mobile-control-height-compact: 40px;
    --cc-shell-mobile-title-size: 26px;
    --cc-shell-mobile-section-title-size: 20px;
    --cc-shell-mobile-body-size: 15px;
    --cc-shell-mobile-meta-size: 12px;
    --cc-shell-mobile-sheet-radius: 20px;
    --cc-shell-mobile-sheet-max-height: 76dvh;
    --cc-shell-mobile-safe-top: env(safe-area-inset-top, 0px);
    --cc-shell-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  }
}