/* Modern reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
img, video, svg { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }

/* Design tokens (overridable via Customizer inline :root) */
:root {
  --color-primary:   #2b6cb0;
  --color-secondary: #4a5568;
  --color-text:      #2d3748;
  --color-bg:        #ffffff;
  --color-link:      #2b6cb0;
  --color-muted:     #718096;
  --color-border:    #e2e8f0;
  --color-surface:   #f7fafc;

  --font-body:    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  --font-heading: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;

  --font-size-sm:   0.875rem;
  --font-size-base: 1rem;
  --font-size-md:   1.125rem;
  --font-size-lg:   1.25rem;
  --font-size-xl:   1.5rem;
  --font-size-xxl:  2rem;
  --font-size-xxxl: 2.5rem;

  --line-height-body:    1.7;
  --line-height-heading: 1.3;

  --space-xs:  0.25rem;
  --space-s:   0.5rem;
  --space-m:   1rem;
  --space-l:   1.5rem;
  --space-xl:  3rem;
  --space-xxl: 5rem;

  --content-width: 1200px;
  --main-width:    68%;
  --loop-columns:  3;

  --loop-title-size:    20px;
  --archive-title-size: 32px;
  --entry-title-size:   40px;
  --card-radius:        8px;
  --image-radius:       4px;
  --loop-card-padding:  24px;

  --color-header-bg:          var(--color-bg);
  --color-footer-bg:          var(--color-surface);
  --color-blockquote:         var(--color-primary);
  --color-table-header-bg:    var(--color-surface);
  --color-widget-bg:          var(--color-surface);
  --color-widget-title-border:var(--color-primary);
  --widget-title-size:        18px;

  --radius-s: 4px;
  --radius-m: 8px;
  --shadow-s: 0 1px 3px rgba(0,0,0,.08);
  --shadow-m: 0 4px 12px rgba(0,0,0,.10);
}

html { font-size: var(--font-size-base); }

body {
  font-family: var(--font-body);
  line-height: var(--line-height-body);
  color:       var(--color-text);
  background:  var(--color-bg);
}

h1, h2, h3, h4, h5, h6 {
  font-family:   var(--font-heading);
  line-height:   var(--line-height-heading);
  color:         var(--color-text);
  margin-bottom: var(--space-s);
}
h1 { font-size: var(--font-size-xxxl); }
h2 { font-size: var(--font-size-xxl); }
h3 { font-size: var(--font-size-xl); }
h4 { font-size: var(--font-size-lg); }
h5 { font-size: var(--font-size-md); }
h6 { font-size: var(--font-size-base); }

p  { margin-bottom: var(--space-m); }
ul, ol { padding-left: var(--space-l); margin-bottom: var(--space-m); }

a { color: var(--color-link); text-decoration: none; }
a:hover, a:focus { text-decoration: underline; }

hr { border: none; border-top: 1px solid var(--color-border); margin: var(--space-xl) 0; }

img { border-radius: var(--image-radius); }
figure { margin: 0; }
figcaption { font-size: var(--font-size-sm); color: var(--color-muted); margin-top: var(--space-xs); }

input[type="text"], input[type="email"], input[type="search"], textarea, select {
  width: 100%;
  padding: var(--space-s) var(--space-m);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  background: var(--color-bg);
  color: var(--color-text);
}
input:focus, textarea:focus, select:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  border-color: var(--color-primary);
}
button, input[type="submit"], input[type="button"] {
  cursor: pointer;
  padding: var(--space-s) var(--space-l);
  background: var(--color-primary);
  color: #fff;
  border: none;
  border-radius: var(--radius-s);
}
button:hover, input[type="submit"]:hover { opacity: .9; }

/* WordPress alignment */
.alignleft  { float: left;  margin-right: var(--space-l); margin-bottom: var(--space-m); }
.alignright { float: right; margin-left:  var(--space-l); margin-bottom: var(--space-m); }
.aligncenter { display: block; margin: 0 auto var(--space-m); }
.alignwide   { margin-left: calc(-1 * var(--space-xl)); margin-right: calc(-1 * var(--space-xl)); max-width: none; }
.alignfull   { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); max-width: 100vw; width: 100vw; }

/* Accessibility */
.screen-reader-text {
  clip: rect(1px,1px,1px,1px);
  height: 1px; width: 1px; overflow: hidden; position: absolute !important;
}
.screen-reader-text:focus {
  background: var(--color-surface); clip: auto; height: auto; width: auto;
  padding: var(--space-m) var(--space-l); position: static !important; z-index: 100000;
}
.skip-link { position: absolute; top: -100%; left: 0; }
.skip-link:focus { top: 0; }

/* Ad slots */
.medko-ad-slot { margin: var(--space-l) 0; }
.medko-ad-slot:empty { display: none; }
