/* ============================================================
   Sentes-BIR Website UI Kit
   Shared styles for all components
   ============================================================ */
@font-face { font-family:'DIN'; font-weight:700; src:url('../../fonts/DINBOLD.TTF') format('truetype'); }
@font-face { font-family:'DIN'; font-weight:400; src:url('../../fonts/DINREGULAR.TTF') format('truetype'); }
@font-face { font-family:'DIN'; font-weight:300; src:url('../../fonts/DINLIGHT.TTF') format('truetype'); }
@font-face { font-family:'Roboto'; font-weight:300; src:url('../../fonts/Roboto-Light.ttf') format('truetype'); }
@font-face { font-family:'Roboto'; font-weight:400; src:url('../../fonts/Roboto-Regular.ttf') format('truetype'); }
@font-face { font-family:'Roboto'; font-weight:500; src:url('../../fonts/Roboto-Medium.ttf') format('truetype'); }
@font-face { font-family:'Roboto'; font-weight:700; src:url('../../fonts/Roboto-Bold.ttf') format('truetype'); }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --c-primary:   #004F63;
  --c-primary-d: #003547;
  --c-accent:    #00A7C1;
  --c-red:       #E42113;
  --c-red-d:     #B51A0A;
  --c-black:     #1D1D1B;
  --c-dark:      #333333;
  --c-mid:       #666666;
  --c-muted:     #999999;
  --c-border:    #D0D0D0;
  --c-surface:   #F5F5F5;
  --c-surf-mid:  #E3E3E3;
  --c-white:     #FFFFFF;
  --font-din:    'DIN','Arial Narrow',sans-serif;
  --font-rob:    'Roboto','Arial',sans-serif;
  --max-w:       1280px; /* @kind other */
  --transition:  0.22s ease-out; /* @kind other */
}

body { font-family: var(--font-rob); color: var(--c-dark); background: var(--c-white); line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { cursor: pointer; border: none; font-family: var(--font-rob); }

/* Layout */
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 48px; }
.section { padding: 80px 0; }
.section-sm { padding: 48px 0; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--font-rob); font-weight: 500; font-size: 13px;
  letter-spacing: 0.07em; text-transform: uppercase; padding: 13px 28px;
  transition: background var(--transition), color var(--transition), border-color var(--transition);
  border-radius: 0;
}
.btn-primary { background: var(--c-primary); color: #fff; }
.btn-primary:hover { background: var(--c-primary-d); }
.btn-accent  { background: var(--c-accent); color: #fff; }
.btn-accent:hover { background: #008BA3; }
.btn-red     { background: var(--c-red); color: #fff; }
.btn-red:hover { background: var(--c-red-d); }
.btn-outline { background: transparent; color: var(--c-primary); border: 2px solid var(--c-primary); padding: 11px 26px; }
.btn-outline:hover { background: var(--c-primary); color: #fff; }
.btn-outline-white { background: transparent; color: #fff; border: 2px solid #fff; padding: 11px 26px; }
.btn-outline-white:hover { background: #fff; color: var(--c-primary); }
.btn-sm { padding: 8px 18px; font-size: 11px; }