/* Picomm Premium Hybrid Design System v1.0 */
:root {
  --pi-navy: #07182E;
  --pi-blue: #153A63;
  --pi-cyan: #17C8F5;
  --pi-silver: #B7C8DA;
  --pi-ice: #F5F8FC;
  --pi-white: #FFFFFF;
  --pi-slate: #475569;
  --pi-border: #DCE6F0;
  --pi-dark-surface: #10263F;
  --pi-hover-cyan: #54D9F9;
  --pi-focus: #17C8F5;
  --pi-success: #147D55;
  --pi-error: #B42318;
  --pi-font-heading: 'Manrope', 'Inter', system-ui, sans-serif;
  --pi-font-body: 'Inter', system-ui, sans-serif;
  --pi-text-base: 1rem;
  --pi-text-lg: 1.125rem;
  --pi-h1: clamp(2.375rem, 5vw, 4rem);
  --pi-h2: clamp(1.875rem, 3.5vw, 2.625rem);
  --pi-h3: clamp(1.3125rem, 2vw, 1.5rem);
  --pi-radius-sm: 6px;
  --pi-radius-md: 10px;
  --pi-radius-card: 16px;
  --pi-radius-xl: 24px;
  --pi-container: 1200px;
  --pi-shadow-card: 0 12px 36px rgb(7 24 46 / 8%);
  --pi-transition: 180ms ease;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font: 400 var(--pi-text-base)/1.6 var(--pi-font-body); color: var(--pi-navy); background: var(--pi-ice); }
h1,h2,h3 { font-family: var(--pi-font-heading); line-height: 1.14; letter-spacing: -.035em; }
h1 { font-size: var(--pi-h1); font-weight: 800; }
h2 { font-size: var(--pi-h2); font-weight: 700; }
h3 { font-size: var(--pi-h3); font-weight: 700; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--pi-focus); outline-offset: 3px; }
.pi-container { width: min(calc(100% - 2rem), var(--pi-container)); margin-inline: auto; }
.pi-section-dark { background: var(--pi-navy); color: var(--pi-white); }
.pi-section-light { background: var(--pi-ice); color: var(--pi-navy); }
.pi-card { background: var(--pi-white); border: 1px solid var(--pi-border); border-radius: var(--pi-radius-card); box-shadow: var(--pi-shadow-card); }
.pi-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 24px; border-radius: var(--pi-radius-md); font: 700 .9375rem/1.2 var(--pi-font-body); text-decoration: none; cursor: pointer; transition: background-color var(--pi-transition), transform var(--pi-transition); }
.pi-button--primary { background: var(--pi-cyan); color: var(--pi-navy); border: 2px solid var(--pi-cyan); }
.pi-button--primary:hover { background: var(--pi-hover-cyan); border-color: var(--pi-hover-cyan); }
.pi-button--navy { background: var(--pi-blue); color: var(--pi-white); border: 2px solid var(--pi-blue); }
.pi-button--navy:hover { background: var(--pi-navy); border-color: var(--pi-navy); }
.pi-button--outline-dark { background: transparent; color: var(--pi-white); border: 2px solid var(--pi-silver); }
.pi-button--outline-dark:hover { background: var(--pi-dark-surface); }
.pi-button--outline-light { background: transparent; color: var(--pi-blue); border: 2px solid var(--pi-blue); }
.pi-button--outline-light:hover { background: #E8F0F8; }
.pi-button:disabled { opacity: .5; cursor: not-allowed; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }
