/*
Theme Name: OTI Slovakia
Theme URI: https://otislovakia.sk
Author: OTI Slovakia
Author URI: https://otislovakia.sk
Description: Custom theme for OTI Slovakia — Outdoor, Trekking and Innovation. A light, community-focused design built around the OTI logo greens and the KST trail-marking colours. Bilingual-ready (Polylang / WPML) with an editable homepage in Appearance → Customize.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oti-slovakia
Tags: custom-colors, custom-logo, custom-menu, featured-images, translation-ready, two-columns, right-sidebar, accessibility-ready
*/

/* ==========================================================================
   1. Design tokens
   The three greens come from the OTI logo. The red / blue / yellow / green
   accents are the Klub slovenských turistov trail-marking colours; each has
   a darker "-ink" variant used wherever the colour becomes text, so every
   text colour clears WCAG AA (4.5:1) on white.
   Primary colours can be overridden in Appearance → Customize → Farby.
   ========================================================================== */
:root{
  --oti-paper:#FFFFFF;
  --oti-surface:#FFFFFF;
  --oti-surface-2:#F4F7F3;
  --oti-ink:#101310;
  --oti-ink-soft:#454E47;
  --oti-ink-faint:#626E66;
  --oti-line:#E4E7E2;

  --oti-green:#008000;          /* logo green   */
  --oti-green-mid:#339933;      /* logo green   */
  --oti-green-light:#99CC99;    /* logo green   */
  --oti-green-deep:#006400;     /* CTA band     */
  --oti-on-green:#FFFFFF;

  --oti-red:#B23A2F;    --oti-red-ink:#A6301F;
  --oti-blue:#2B5C8F;   --oti-blue-ink:#2B5C8F;
  --oti-yellow:#C79212; --oti-yellow-ink:#8A6608;
  --oti-tgreen:#339933; --oti-tgreen-ink:#1F7A1F;

  --oti-shadow:0 1px 0 rgba(16,19,16,.06);
  --oti-radius:4px;
  --oti-maxw:1140px;
  --oti-gutter:24px;
}

/* ==========================================================================
   2. Reset & base
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--oti-paper);
  color:var(--oti-ink);
  font-family:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{
  font-family:Archivo,"Helvetica Neue",Arial,sans-serif;
  font-weight:700;
  letter-spacing:-.022em;
  line-height:1.12;
  text-wrap:balance;
  margin:0 0 .5em;
}
p,ul,ol,dl,pre,table,figure,blockquote{margin:0 0 1.15em}
:where(p,li):last-child{margin-bottom:0}
a{color:inherit;text-decoration-color:var(--oti-green);text-underline-offset:3px}
a:hover{color:var(--oti-green)}
img,svg,video{max-width:100%;height:auto}
figure{margin-inline:0}
:focus-visible{outline:3px solid var(--oti-yellow);outline-offset:3px}
hr{border:0;border-top:1px solid var(--oti-line);margin:2em 0}
code,pre,kbd{font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;font-size:.92em}
pre{background:var(--oti-surface-2);padding:16px 18px;border-radius:var(--oti-radius);overflow-x:auto}
blockquote{
  border-left:4px solid var(--oti-green);
  padding-left:20px;margin-inline:0;color:var(--oti-ink-soft);
}
table{border-collapse:collapse;width:100%}
th,td{border:1px solid var(--oti-line);padding:10px 12px;text-align:left}
th{background:var(--oti-surface-2);font-family:Archivo,sans-serif;font-size:14.5px}

.oti-wrap{width:100%;max-width:var(--oti-maxw);margin-inline:auto;padding-inline:var(--oti-gutter)}
.oti-narrow{max-width:76ch;margin-inline:auto}

/* accessibility helpers ---------------------------------------------------- */
.screen-reader-text{
  border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;
  padding:0;position:absolute;width:1px;word-wrap:normal!important;
}
.screen-reader-text:focus{
  background:var(--oti-surface);clip-path:none;color:var(--oti-ink);
  display:block;font-size:15px;font-weight:700;height:auto;left:5px;
  line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;
  width:auto;z-index:100000;box-shadow:0 0 2px 2px rgba(0,0,0,.2);
}
.oti-skip-link:focus{outline:3px solid var(--oti-yellow)}

/* ==========================================================================
   3. Brand device — the three diverging bands from the OTI logo
   ========================================================================== */
.oti-bars{display:flex;flex-direction:column}
.oti-bars i{display:block;height:3px}
.oti-bars i:nth-child(1){background:var(--oti-green-light)}
.oti-bars i:nth-child(2){background:var(--oti-green-mid)}
.oti-bars i:nth-child(3){background:var(--oti-green)}

/* KST trail blaze: white band, colour band, white band */
.oti-blaze{
  display:inline-block;width:30px;height:14px;flex:none;position:relative;
  background:#fff;border:1px solid var(--oti-line);border-radius:1px;
}
.oti-blaze::after{
  content:"";position:absolute;left:0;right:0;top:4px;height:4px;
  background:var(--oti-bz,var(--oti-red));
}
.oti-eyebrow{
  display:flex;align-items:center;gap:12px;
  font-family:Archivo,sans-serif;font-weight:600;font-size:12.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--oti-ink-soft);
  margin:0 0 18px;
}

/* ==========================================================================
   4. Buttons & links
   ========================================================================== */
.oti-btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:Archivo,sans-serif;font-weight:600;font-size:15px;letter-spacing:-.01em;
  padding:13px 22px;border-radius:var(--oti-radius);text-decoration:none;
  border:1.5px solid transparent;cursor:pointer;
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.oti-btn--solid{background:var(--oti-green);color:var(--oti-on-green)}
.oti-btn--solid:hover{transform:translateY(-2px);color:var(--oti-on-green)}
.oti-btn--ghost{border-color:var(--oti-ink);color:var(--oti-ink)}
.oti-btn--ghost:hover{background:var(--oti-ink);color:var(--oti-paper)}
.oti-btn--sm{padding:9px 16px;font-size:14px}

.oti-more{
  font-family:Archivo,sans-serif;font-weight:600;font-size:14.5px;
  text-decoration:none;border-bottom:2px solid var(--oti-green);
  padding-bottom:2px;white-space:nowrap;
}

/* ==========================================================================
   5. Header
   ========================================================================== */
.oti-topbar{
  background:var(--oti-surface);color:var(--oti-ink-soft);
  border-bottom:1px solid var(--oti-line);font-size:13.5px;
}
.oti-topbar .oti-wrap{
  display:flex;flex-wrap:wrap;gap:8px 16px;
  justify-content:space-between;align-items:center;padding-block:7px;
}
.oti-topbar a{text-decoration:none}
.oti-topbar a:hover{text-decoration:underline}

.oti-head{
  position:sticky;top:0;z-index:40;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--oti-line);
}
.oti-head .oti-wrap{display:flex;align-items:center;gap:28px;padding-block:14px}
.oti-brand{display:flex;align-items:center;text-decoration:none;flex:none;gap:12px}
.oti-brand img{display:block;height:44px;width:auto}
.oti-brand-text strong{
  display:block;font-family:Archivo,sans-serif;font-weight:800;
  font-size:19px;letter-spacing:-.01em;line-height:1.1;
}
.oti-brand-text span{
  display:block;font-size:11.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--oti-ink-faint);
}

.oti-nav{margin-left:auto}
.oti-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:26px;align-items:center}
.oti-nav li{position:relative}
.oti-nav li.menu-item-has-children,
.oti-nav li.page_item_has_children{display:flex;flex-wrap:wrap;align-items:center;gap:0 3px}

/* caret that opens a submenu — also the keyboard and touch route in */
.oti-sub{
  appearance:none;-webkit-appearance:none;background:none;border:0;color:inherit;
  padding:8px 4px;cursor:pointer;display:inline-flex;align-items:center;line-height:0;
}
.oti-sub::before{
  content:"";width:7px;height:7px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:translateY(-2px) rotate(45deg);transition:transform .18s ease;
}
.oti-nav li.oti-open>.oti-sub::before{transform:translateY(1px) rotate(-135deg)}
.oti-nav a{
  display:block;text-decoration:none;
  font-family:Archivo,sans-serif;font-weight:600;font-size:15.5px;
  padding-block:6px;border-bottom:2.5px solid transparent;
}
.oti-nav a:hover,
.oti-nav .current-menu-item>a,
.oti-nav .current_page_item>a,
.oti-nav .current-menu-ancestor>a,
.oti-nav .current_page_ancestor>a{border-bottom-color:var(--oti-yellow);color:var(--oti-ink)}

/* dropdowns */
.oti-nav ul ul{
  position:absolute;top:100%;left:-14px;min-width:250px;display:block;
  flex-direction:column;gap:0;background:var(--oti-surface);
  border:1px solid var(--oti-line);border-radius:var(--oti-radius);
  box-shadow:0 12px 30px rgba(16,19,16,.10);padding:6px 0;
  opacity:0;visibility:hidden;transform:translateY(4px);
  transition:opacity .15s ease,transform .15s ease,visibility .15s;
  z-index:50;
}
.oti-nav li:hover>ul,
.oti-nav li:focus-within>ul,
.oti-nav li.oti-open>ul{opacity:1;visibility:visible;transform:none}
.oti-nav ul ul a{
  padding:9px 18px;border-bottom:0;border-left:3px solid transparent;
  font-size:15px;font-weight:500;
}
.oti-nav ul ul a:hover{border-left-color:var(--oti-green);background:var(--oti-surface-2)}
.oti-nav ul ul ul{top:0;left:100%}

.oti-head-cta{flex:none}

/* ==========================================================================
   6. Sections & hero
   ========================================================================== */
.oti-sec{padding-block:clamp(52px,7vw,84px)}
.oti-sec--alt{background:var(--oti-surface-2);border-block:1px solid var(--oti-line)}
.oti-sec--tight{padding-block:clamp(40px,5vw,60px)}
.oti-sec-head{max-width:52ch;margin-bottom:38px}
.oti-sec-head h2{font-size:clamp(28px,3.6vw,40px);margin-bottom:0}
.oti-sec-head p{margin:14px 0 0;color:var(--oti-ink-soft);font-size:18px}
.oti-sec-head--row{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:24px;max-width:none;
}

.oti-hero{padding-block:clamp(46px,7vw,84px) clamp(40px,6vw,68px)}
.oti-hero .oti-wrap{
  display:grid;grid-template-columns:1.06fr .94fr;
  gap:clamp(28px,4vw,58px);align-items:center;
}
.oti-hero h1{font-size:clamp(38px,5.6vw,62px);font-weight:800;letter-spacing:-.035em;margin-bottom:0}
.oti-hero .oti-lede{margin:20px 0 0;font-size:19px;color:var(--oti-ink-soft);max-width:34em}
.oti-hero .oti-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.oti-hero-meta{
  display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:32px;padding-top:22px;
  border-top:1px solid var(--oti-line);font-size:14.5px;color:var(--oti-ink-faint);
}
.oti-hero-meta b{color:var(--oti-ink);font-family:Archivo,sans-serif;font-weight:700}
.oti-hero-media img{
  display:block;width:100%;aspect-ratio:4/3.2;object-fit:cover;
  border-radius:6px;border:1px solid var(--oti-line);
}

/* placeholder illustration, shown until a hero image is set */
.oti-hills{
  position:relative;aspect-ratio:4/3.2;border-radius:6px;overflow:hidden;
  background:linear-gradient(180deg,var(--oti-surface-2),var(--oti-surface));
  border:1px solid var(--oti-line);
}
.oti-hills i{position:absolute;left:-4%;right:-4%;bottom:0;display:block;border-radius:50% 50% 0 0 / 100% 100% 0 0}
.oti-hills .h1{height:46%;background:var(--oti-green-deep)}
.oti-hills .h2{height:62%;background:var(--oti-green-mid);transform:translateX(-16%)}
.oti-hills .h3{height:34%;background:var(--oti-green-light);transform:translateX(22%)}
.oti-hills .sun{
  position:absolute;display:block;right:15%;top:13%;left:auto;bottom:auto;
  width:clamp(46px,8%,78px);aspect-ratio:1;border-radius:50%;
  background:var(--oti-yellow);opacity:.9;
}

/* ==========================================================================
   7. Partners strip
   ========================================================================== */
.oti-partners{border-block:1px solid var(--oti-line);background:var(--oti-surface-2)}
.oti-partners .oti-wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 34px;padding-block:20px}
.oti-partners .oti-lbl{
  font-family:Archivo,sans-serif;font-size:12px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--oti-ink-faint);
}
.oti-partners img{max-height:44px;width:auto}

/* ==========================================================================
   8. Cards
   ========================================================================== */
.oti-grid{display:grid;gap:20px}
.oti-grid--4{grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))}
.oti-grid--3{grid-template-columns:repeat(auto-fit,minmax(min(330px,100%),1fr))}
.oti-grid--2{grid-template-columns:repeat(auto-fit,minmax(min(460px,100%),1fr))}

.oti-card{
  background:var(--oti-surface);border:1px solid var(--oti-line);
  border-radius:var(--oti-radius);padding:26px 24px 24px;
  display:flex;flex-direction:column;gap:12px;position:relative;
  box-shadow:var(--oti-shadow);transition:transform .16s ease;
}
.oti-card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:var(--oti-bz,var(--oti-green));
  border-radius:var(--oti-radius) var(--oti-radius) 0 0;
}
.oti-card:hover{transform:translateY(-3px)}
.oti-card h3{font-size:20px;margin-bottom:0}
.oti-card p{color:var(--oti-ink-soft);font-size:16px;flex:1;margin-bottom:0}
.oti-card .oti-more{align-self:flex-start;margin-top:4px}
a.oti-card{text-decoration:none;color:inherit}
a.oti-card:hover h3{color:var(--oti-bzt,var(--oti-green))}
.oti-card-label{
  font-family:Archivo,sans-serif;font-weight:800;font-size:13px;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--oti-bzt,var(--oti-green));
}
.oti-go{
  font-family:Archivo,sans-serif;font-weight:600;font-size:14px;
  color:var(--oti-bzt,var(--oti-green));display:inline-flex;align-items:center;gap:6px;
}
.oti-chip{
  font-family:Archivo,sans-serif;font-size:11.5px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;padding:4px 9px;
  border-radius:99px;border:1px solid var(--oti-line);
  color:var(--oti-ink-soft);align-self:flex-start;
}

/* ==========================================================================
   9. Stats
   ========================================================================== */
.oti-stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));gap:1px;
  background:var(--oti-line);border:1px solid var(--oti-line);
  border-radius:var(--oti-radius);overflow:hidden;
}
.oti-stat{background:var(--oti-surface);padding:28px 24px}
.oti-stat b{
  display:block;font-family:Archivo,sans-serif;font-weight:800;
  font-size:clamp(34px,4.4vw,48px);letter-spacing:-.04em;line-height:1;
  font-variant-numeric:tabular-nums;
}
.oti-stat span{display:block;margin-top:9px;font-size:15px;color:var(--oti-ink-soft)}

/* ==========================================================================
   10. Mission
   ========================================================================== */
.oti-mission{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,5vw,64px);align-items:start}
.oti-mission blockquote{
  margin:0;padding:0;border:0;color:var(--oti-ink);
  font-family:Archivo,sans-serif;font-weight:600;
  font-size:clamp(22px,2.6vw,28px);line-height:1.28;letter-spacing:-.02em;
}
.oti-mission blockquote::before{content:"\201E"}
.oti-mission blockquote::after{content:"\201C"}
.oti-mlist{list-style:none;margin:0;padding:0;display:grid;gap:0}
.oti-mlist li{
  display:flex;gap:14px;align-items:flex-start;padding:13px 0;
  border-top:1px solid var(--oti-line);font-size:16.5px;margin:0;
}
.oti-mlist li:last-child{border-bottom:1px solid var(--oti-line)}

/* ==========================================================================
   11. CTA band
   ========================================================================== */
.oti-band{background:var(--oti-green-deep);color:var(--oti-on-green)}
.oti-band .oti-wrap{
  padding-block:clamp(44px,6vw,66px);display:grid;
  grid-template-columns:1.3fr .7fr;gap:32px;align-items:center;
}
.oti-band h2{font-size:clamp(26px,3.4vw,38px);margin-bottom:0}
.oti-band p{margin:14px 0 0;opacity:.88;font-size:17.5px;max-width:46ch}
.oti-band .oti-btn--solid{background:var(--oti-on-green);color:var(--oti-green-deep)}
.oti-band .oti-btn--solid:hover{color:var(--oti-green-deep)}
.oti-band .oti-btn--ghost{border-color:currentColor;color:inherit}
.oti-band .oti-btn--ghost:hover{background:var(--oti-on-green);color:var(--oti-green-deep)}
.oti-band-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}

/* ==========================================================================
   12. Events list
   ========================================================================== */
.oti-event{
  display:grid;grid-template-columns:104px 1fr auto;gap:24px;align-items:center;
  padding:20px 0;border-top:1px solid var(--oti-line);
}
.oti-event:last-child{border-bottom:1px solid var(--oti-line)}
.oti-edate{
  font-family:Archivo,sans-serif;font-weight:700;line-height:1.05;
  border-left:4px solid var(--oti-bz,var(--oti-green));padding-left:13px;
}
.oti-edate em{display:block;font-style:normal;font-size:28px;letter-spacing:-.03em}
.oti-edate span{
  display:block;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--oti-ink-faint);margin-top:3px;
}
.oti-event h3{font-size:19px;margin-bottom:0}
.oti-event p{color:var(--oti-ink-soft);font-size:15.5px;margin:4px 0 0}

/* ==========================================================================
   13. FAQ
   ========================================================================== */
.oti-faq{max-width:78ch}
.oti-faq details{border-top:1px solid var(--oti-line)}
.oti-faq details:last-of-type{border-bottom:1px solid var(--oti-line)}
.oti-faq summary{
  cursor:pointer;list-style:none;padding:19px 40px 19px 0;position:relative;
  font-family:Archivo,sans-serif;font-weight:600;font-size:18px;letter-spacing:-.015em;
}
.oti-faq summary::-webkit-details-marker{display:none}
.oti-faq summary::after{
  content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;
  border-right:2.5px solid var(--oti-green);border-bottom:2.5px solid var(--oti-green);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s ease;
}
.oti-faq details[open] summary::after{transform:translateY(-25%) rotate(-135deg)}
.oti-faq .oti-answer{padding:0 40px 22px 0;color:var(--oti-ink-soft)}

/* ==========================================================================
   14. Newsletter
   ========================================================================== */
.oti-news{
  background:var(--oti-surface-2);border:1px solid var(--oti-line);
  border-radius:var(--oti-radius);padding:clamp(28px,4vw,44px);
  display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;
}
.oti-news h2{font-size:clamp(24px,3vw,32px);margin-bottom:0}
.oti-news p{margin:12px 0 0;color:var(--oti-ink-soft)}

/* ==========================================================================
   15. Footer
   ========================================================================== */
.oti-footer{background:var(--oti-surface);color:var(--oti-ink)}
.oti-footer .oti-wrap{padding-block:52px 24px}
.oti-fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.oti-footer h2,.oti-footer h4,.oti-footer .widget-title{
  font-family:Archivo,sans-serif;font-size:12.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--oti-ink-faint);margin:0 0 14px;
}
.oti-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:15.5px}
.oti-footer li{margin:0}
.oti-footer a{text-decoration:none}
.oti-footer a:hover{text-decoration:underline}
.oti-fbrand img{display:block;height:54px;width:auto;margin-bottom:14px}
.oti-fbrand strong{display:block;font-family:Archivo,sans-serif;font-weight:800;font-size:22px}
.oti-fbrand p{margin:12px 0 0;color:var(--oti-ink-soft);font-size:15.5px;max-width:32ch}
.oti-socials{display:flex;gap:9px;margin-top:18px}
.oti-socials a{
  width:36px;height:36px;border:1px solid rgba(16,19,16,.14);border-radius:4px;
  display:grid;place-items:center;text-decoration:none;color:var(--oti-ink);
}
.oti-socials a:hover{background:var(--oti-green);color:var(--oti-on-green);border-color:var(--oti-green)}
.oti-socials svg{width:18px;height:18px;fill:currentColor;display:block}
.oti-fbot{
  margin-top:38px;padding-top:20px;border-top:1px solid rgba(16,19,16,.14);
  display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;
  align-items:center;font-size:14px;color:var(--oti-ink-faint);
}

/* footer language switcher (Polylang / WPML / fallback) */
.oti-langbox{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.oti-langbox .oti-lbl{
  font-family:Archivo,sans-serif;font-size:11.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--oti-ink-faint);
}
.oti-langbox ul{display:flex;gap:6px;margin:0;padding:0;list-style:none}
.oti-langbox li{margin:0}
.oti-langbox a,.oti-langbox .current-lang>a,.oti-langbox strong{
  font-family:Archivo,sans-serif;font-weight:600;font-size:14px;letter-spacing:.03em;
  padding:6px 13px;border-radius:99px;border:1.5px solid rgba(16,19,16,.14);
  text-decoration:none;display:inline-block;color:var(--oti-ink);
}
.oti-langbox a:hover{border-color:var(--oti-green);color:var(--oti-green);text-decoration:none}
.oti-langbox .current-lang>a,.oti-langbox strong{
  background:var(--oti-green);border-color:var(--oti-green);color:var(--oti-on-green);
}
.oti-langbox img{display:inline-block;vertical-align:-2px;margin-right:6px}

/* ==========================================================================
   16. Single / page / archive content
   ========================================================================== */
.oti-page-head{padding-block:clamp(38px,5vw,60px) 0}
.oti-page-head h1{font-size:clamp(32px,4.6vw,52px);letter-spacing:-.03em}
.oti-page-head .oti-meta{
  margin-top:14px;font-size:14.5px;color:var(--oti-ink-faint);
  display:flex;flex-wrap:wrap;gap:8px 18px;
}
.oti-breadcrumb{
  font-size:13.5px;color:var(--oti-ink-faint);margin-bottom:16px;
}
.oti-breadcrumb a{text-decoration:none}
.oti-breadcrumb a:hover{text-decoration:underline}
.oti-featured{margin:32px 0 0}
.oti-featured img{width:100%;border-radius:6px;border:1px solid var(--oti-line)}

.oti-content{padding-block:clamp(30px,4vw,44px) clamp(52px,7vw,80px)}
.oti-content h2{font-size:clamp(24px,3vw,32px);margin-top:1.8em}
.oti-content h3{font-size:22px;margin-top:1.6em}
.oti-content h4{font-size:18.5px;margin-top:1.5em}
.oti-content>*:first-child{margin-top:0}
.oti-content ul,.oti-content ol{padding-left:1.3em}
.oti-content li{margin-bottom:.4em}
.oti-content img{border-radius:6px}

.oti-postlist{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.oti-post-card{
  background:var(--oti-surface);border:1px solid var(--oti-line);
  border-radius:var(--oti-radius);overflow:hidden;display:flex;flex-direction:column;
  transition:transform .16s ease;
}
.oti-post-card:hover{transform:translateY(-3px)}
.oti-post-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.oti-post-card .oti-body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.oti-post-card h2{font-size:20px;margin:0}
.oti-post-card h2 a{text-decoration:none}
.oti-post-card p{color:var(--oti-ink-soft);font-size:16px;flex:1;margin:0}
.oti-post-card time{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--oti-ink-faint);font-family:Archivo,sans-serif}

.oti-pagination{margin-top:44px;display:flex;justify-content:center}
.oti-pagination .page-numbers{
  display:inline-block;padding:9px 15px;margin:0 3px;text-decoration:none;
  border:1px solid var(--oti-line);border-radius:var(--oti-radius);
  font-family:Archivo,sans-serif;font-weight:600;font-size:15px;
}
.oti-pagination .page-numbers.current,
.oti-pagination .page-numbers:hover{
  background:var(--oti-green);color:var(--oti-on-green);border-color:var(--oti-green);
}

.oti-postnav{
  display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;
  margin-top:44px;padding-top:24px;border-top:1px solid var(--oti-line);
}
.oti-postnav a{text-decoration:none;font-family:Archivo,sans-serif;font-weight:600}

/* search form */
.oti-searchform{display:flex;gap:10px;flex-wrap:wrap}
.oti-searchform input[type="search"],
input[type="text"],input[type="email"],input[type="url"],input[type="tel"],
input[type="number"],input[type="password"],textarea,select{
  padding:12px 15px;border:1.5px solid var(--oti-line);border-radius:var(--oti-radius);
  background:var(--oti-surface);color:var(--oti-ink);font:inherit;font-size:16px;
  max-width:100%;
}
textarea{width:100%}
input::placeholder,textarea::placeholder{color:var(--oti-ink-faint)}
input[type="submit"],button[type="submit"]{
  font-family:Archivo,sans-serif;font-weight:600;font-size:15px;
  padding:13px 22px;border-radius:var(--oti-radius);border:0;cursor:pointer;
  background:var(--oti-green);color:var(--oti-on-green);
}

/* WordPress alignment & caption classes */
.alignleft{float:left;margin:.4em 1.6em 1em 0}
.alignright{float:right;margin:.4em 0 1em 1.6em}
.aligncenter{display:block;margin-inline:auto}
.alignwide{width:min(100vw - 2*var(--oti-gutter),1320px);margin-inline:auto}
.alignfull{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)}
.wp-caption{max-width:100%}
.wp-caption-text,.wp-element-caption,figcaption{
  font-size:14.5px;color:var(--oti-ink-faint);margin-top:8px;text-align:center;
}
.sticky .oti-post-card{border-color:var(--oti-green)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.gallery-item{margin:0}

/* comments */
.oti-comments{margin-top:52px;padding-top:32px;border-top:1px solid var(--oti-line)}
.oti-comments h2{font-size:22px}
.oti-comments .comment-list,.oti-comments .children{list-style:none;padding:0;margin:0}
.oti-comments .children{padding-left:26px;border-left:2px solid var(--oti-line);margin-top:16px}
.oti-comments article{
  padding:18px 0;border-bottom:1px solid var(--oti-line);
}
.oti-comments .comment-meta{font-size:14px;color:var(--oti-ink-faint);margin-bottom:8px}
.oti-comments .avatar{border-radius:50%;vertical-align:middle;margin-right:8px}
.comment-form p{margin-bottom:14px}
.comment-form label{
  display:block;font-family:Archivo,sans-serif;font-weight:600;
  font-size:14px;margin-bottom:5px;
}

/* widgets (footer / sidebar) */
.oti-widget{margin-bottom:28px}
.oti-widget:last-child{margin-bottom:0}

/* ==========================================================================
   17. Responsive
   ========================================================================== */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

@media (max-width:1080px){
  /* The main menu stays a visible horizontal row — it moves to its own
     line under the logo and wraps, rather than collapsing into a button. */
  .oti-head .oti-wrap{flex-wrap:wrap;gap:10px 16px}
  .oti-nav{
    order:3;width:100%;margin-left:0;
    border-top:1px solid var(--oti-line);padding-top:2px;
  }
  .oti-nav>ul{flex-wrap:wrap;gap:0 20px;align-items:center}
  .oti-nav a{font-size:15px}
  /* Submenus open as one full-width panel under the row, so opening
     "O nás" never pushes the other items around. */
  .oti-nav{position:relative}
  .oti-nav>ul>li{position:static}
  .oti-nav ul ul{
    position:absolute;left:0;right:0;top:100%;
    display:none;width:auto;min-width:0;
    opacity:1;visibility:visible;transform:none;
    background:var(--oti-surface);
    border:0;border-top:1px solid var(--oti-line);border-radius:0;
    box-shadow:0 14px 28px rgba(16,19,16,.10);
    padding:8px 0 12px;z-index:60;
  }
  .oti-nav li.oti-open>ul{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));
    gap:0 22px;
  }
  .oti-nav ul ul li{width:auto}
  .oti-nav ul ul a{padding:9px 0;border-bottom:0;border-left:0;font-weight:500}
  .oti-nav ul ul a:hover{border-left:0;background:none;color:var(--oti-green)}
  .oti-nav ul ul ul{position:static;display:block;box-shadow:none;border:0;padding:0 0 0 14px}
  .oti-head-cta{margin-left:auto}
}

@media (max-width:860px){
  .oti-hero .oti-wrap{grid-template-columns:1fr}
  .oti-hero-media,.oti-hills{order:-1}
  .oti-mission{grid-template-columns:1fr}
  .oti-band .oti-wrap{grid-template-columns:1fr}
  .oti-band-actions{justify-content:flex-start}
  .oti-news{grid-template-columns:1fr}
  .oti-fgrid{grid-template-columns:1fr 1fr}
  .oti-event{grid-template-columns:88px 1fr;row-gap:12px}
  .oti-event .oti-more{grid-column:2}
  .gallery{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:560px){
  body{font-size:16.5px}
  .oti-fgrid{grid-template-columns:1fr}
  .oti-sec-head--row{flex-direction:column;align-items:flex-start}
  .oti-brand img{height:36px}
  .oti-fbrand img{height:46px}
  .oti-nav>ul{gap:0 14px}
  .oti-nav a{font-size:14.5px}
  .alignleft,.alignright{float:none;margin:1em 0}
}

@media print{
  .oti-head,.oti-topbar,.oti-band,.oti-news,.oti-footer{display:none!important}
  body{font-size:12pt;color:#000}
}