/*
Theme Name:  Spojení Festival
Theme URI:   https://festivalspojeni.cz
Description: Custom theme for Festival Spojení — personal development festival, Liberec.
Version:     1.7.0
Author:      Festival Spojení
Author URI:  https://festivalspojeni.cz
Text Domain: spojeni
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License:     All Rights Reserved
*/

/* ─────────────────────────────────────────
   DESIGN TOKENS
   All colours, type, spacing defined here.
   Edit these variables to retheme the site.
───────────────────────────────────────── */

:root {
    /* Colours */
    --color-cream:      #EFE4D2;
    --color-cream-dark: #E1D2C2;
    --color-white:      #FDFAF4;
    --color-olive:      #3D4A28;
    --color-olive-mid:  #4F5E35;
    --color-green-dark: #414123;
    --color-gold:       #C9A84C;
    --color-gold-bg:    #E8D5A3;
    --color-ink:        #1E1C18;
    --color-muted:      #7A7265;
    --color-blush:      #C8B49A;

    /* Typography */
    --font-serif: 'Cormorant Garamond', Georgia, serif;
    --font-display: 'lust-sans', 'Cormorant Garamond', Georgia, serif;
    --font-sans:  'DM Sans', system-ui, -apple-system, sans-serif;

    /* Font sizes */
    --text-xs:   0.6875rem;  /* 11px — eyebrows, labels */
    --text-sm:   0.875rem;   /* 14px — captions, meta */
    --text-base: 1rem;       /* 16px — body */
    --text-md:   1.125rem;   /* 18px — lead body */
    --text-lg:   1.75rem;    /* 28px — small headings */
    --text-xl:   2.5rem;     /* 40px — section titles */
    --text-2xl:  3.5rem;     /* 56px — large section titles */
    --text-3xl:  5rem;       /* 80px — hero */
    --text-stat: 7rem;       /* 112px — stat number */

    /* Spacing (8px base unit) */
    --space-1:  0.25rem;   /*  4px */
    --space-2:  0.5rem;    /*  8px */
    --space-3:  0.75rem;   /* 12px */
    --space-4:  1rem;      /* 16px */
    --space-5:  1.25rem;   /* 20px */
    --space-6:  1.5rem;    /* 24px */
    --space-8:  2rem;      /* 32px */
    --space-10: 2.5rem;    /* 40px */
    --space-12: 3rem;      /* 48px */
    --space-16: 4rem;      /* 64px */

    /* Layout */
    --max-width:    1200px;
    --content-pad:  clamp(1.5rem, 4vw, 2.5rem);
    --section-pad:  clamp(4rem, 7vw, 6rem);

    /* Borders */
    --border-thin:   0.5px solid var(--color-blush);
    --border-ink:    1px solid var(--color-ink);

    /* Transitions */
    --transition: 200ms ease;
}

/* ─────────────────────────────────────────
   RESET & BASE
───────────────────────────────────────── */

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

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    /* Offset anchor scroll targets below the sticky header.
       Update this value if the header height changes. */
    scroll-padding-top: 64px;
}

body {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    line-height: 1.7;
    color: var(--color-ink);
    background: var(--color-cream);
    -webkit-font-smoothing: antialiased;
}

img, video {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

ul, ol {
    list-style: none;
}

button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
}

/* WordPress core classes we need to handle */
.wp-block-image img {
    border-radius: 0;
}

.alignwide {
    max-width: var(--max-width);
    margin-left: auto;
    margin-right: auto;
}