/*
Theme Name: Coolberg
Theme URI: https://coolberg.hu/
Description: Original child theme of Twenty Twelve. Lookalike of the historic coolberg.hu homepage (header, menu, slider, three service boxes, footer) based on Wayback snapshots. Not derived from StudioPress or Genesis source. No remote fonts or libraries.
Author: Coolberg / Vimate Kft.
Template: twentytwelve
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: coolberg-child
*/

/* Visual tokens observed on historic coolberg.hu (Wayback 2015–2025):
   page background #bfbfbf, white 1140px shell, accent #64c9ea, footer #222.
   CSS below is original — not a copy of Executive Pro's stylesheet. */

:root {
    --cb-bg: #bfbfbf;
    --cb-shell: #ffffff;
    --cb-ink: #222222;
    --cb-muted: #666666;
    --cb-accent: #64c9ea;
    --cb-accent-hover: #4bb6d9;
    --cb-nav-bg: #f2f2f2;
    --cb-footer: #222222;
    --cb-footer-ink: #c8c8c8;
    --cb-width: 1140px;
    --cb-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

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

html {
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
}

body.coolberg-site,
body {
    margin: 0;
    background: var(--cb-bg);
    color: var(--cb-ink);
    font-family: var(--cb-font);
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.6;
}

img {
    max-width: 100%;
    height: auto;
    border: 0;
    vertical-align: middle;
}

a {
    color: var(--cb-accent);
    text-decoration: none;
}

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

h1, h2, h3, h4 {
    font-weight: 700;
    line-height: 1.25;
    color: var(--cb-ink);
}

p {
    margin: 0 0 1.2em;
}

.skip-link {
    position: absolute;
    left: -999px;
    top: 0;
    background: #000;
    color: #fff;
    padding: 8px 12px;
    z-index: 100;
}

.skip-link:focus {
    left: 8px;
}

.wrap {
    width: 100%;
    max-width: var(--cb-width);
    margin: 0 auto;
    padding: 0 16px;
}

.site-container {
    max-width: var(--cb-width);
    margin: 0 auto;
    background: var(--cb-shell);
}

/* Header */

.site-header {
    background: var(--cb-shell);
    min-height: 100px;
}

.site-header .wrap {
    display: flex;
    align-items: center;
    min-height: 100px;
}

.title-area {
    display: flex;
    align-items: center;
    min-height: 80px;
}

.site-logo-link {
    display: inline-block;
    text-decoration: none;
}

.site-logo {
    display: block;
    width: auto;
    max-width: 260px;
    height: 59px;
    object-fit: contain;
}

.site-title-text {
    display: block;
    font-size: 28px;
    font-weight: 700;
    color: var(--cb-ink);
    padding: 20px 0;
}

/* Primary nav — light bar, current item in accent blue */

.nav-primary {
    background: var(--cb-nav-bg);
    border-top: 1px solid #e5e5e5;
}

.nav-primary .wrap {
    padding: 0;
}

.menu-primary {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

.menu-primary .menu-item {
    margin: 0;
}

.menu-primary a {
    display: block;
    color: var(--cb-muted);
    padding: 16px 20px;
    font-size: 14px;
    font-size: 1.4rem;
    text-decoration: none;
}

.menu-primary a:hover,
.menu-primary a:focus {
    background: #ffffff;
    color: var(--cb-muted);
    text-decoration: none;
}

.menu-primary .current-menu-item > a,
.menu-primary .current_page_item > a {
    background: var(--cb-accent);
    color: #ffffff;
}

/* Homepage slider */

.home-main {
    padding: 0;
}

.home-slider {
    position: relative;
    overflow: hidden;
    background: #111;
    max-height: 400px;
}

.cb-slides {
    position: relative;
}

.cb-slide {
    display: none;
    position: relative;
}

.cb-slide.is-active {
    display: block;
}

.cb-slide-image img {
    display: block;
    width: 100%;
    height: 400px;
    object-fit: cover;
    object-position: center;
}

.cb-slide-caption {
    position: absolute;
    left: 0;
    top: 0;
    width: 30%;
    min-width: 200px;
    height: 100%;
    background: #222222;
    color: #dddddd;
    z-index: 2;
}

.cb-slide-caption-inner {
    padding: 4% 8%;
}

.cb-slide-caption h2 {
    margin: 0 0 12px;
    font-size: 20px;
    font-size: 2rem;
    text-transform: uppercase;
}

.cb-slide-caption h2 a {
    color: #ffffff;
    text-decoration: none;
}

.cb-slide-caption h2 a:hover,
.cb-slide-caption h2 a:focus {
    color: var(--cb-accent);
}

.cb-slide-caption p {
    margin: 0;
    color: #dddddd;
    font-size: 14px;
    font-size: 1.4rem;
}

.cb-slide-caption .more-link {
    display: block;
    margin-top: 20px;
    color: var(--cb-accent);
}

.cb-slider-prev,
.cb-slider-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 40px;
    height: 48px;
    border: 0;
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}

.cb-slider-prev:hover,
.cb-slider-next:hover,
.cb-slider-prev:focus,
.cb-slider-next:focus {
    background: var(--cb-accent);
}

.cb-slider-prev { left: 0; }
.cb-slider-next { right: 0; }

.cb-slider-dots {
    position: absolute;
    left: 32%;
    bottom: 16px;
    z-index: 3;
    display: flex;
    gap: 8px;
}

.cb-slider-dot {
    width: 12px;
    height: 12px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.55);
    cursor: pointer;
    padding: 0;
}

.cb-slider-dot.is-active,
.cb-slider-dot:hover,
.cb-slider-dot:focus {
    background: var(--cb-accent);
}

/* Three service boxes */

.home-middle {
    display: flex;
    gap: 28px;
    padding: 36px 16px 20px;
    text-align: center;
}

.service-box {
    flex: 1 1 0;
    min-width: 0;
}

.service-box .widget-title,
.footer-col .widget-title {
    margin: 0 0 16px;
    font-size: 16px;
    font-size: 1.6rem;
    text-transform: uppercase;
    font-weight: 700;
}

.service-box .widget-title a {
    color: var(--cb-ink);
    text-decoration: none;
}

.service-box .widget-title a:hover,
.service-box .widget-title a:focus {
    color: var(--cb-accent);
}

.service-box img {
    display: inline-block;
    margin: 0 0 12px;
    width: 190px;
    height: 100px;
    object-fit: cover;
}

.service-box p {
    text-align: justify;
    font-size: 15px;
    font-size: 1.5rem;
    color: var(--cb-ink);
}

.service-box .more-link {
    white-space: nowrap;
}

/* Inner pages */

.site-inner {
    background: var(--cb-shell);
}

.content-area {
    padding: 36px 48px 24px;
}

.entry-title {
    margin: 0 0 20px;
    font-size: 28px;
    font-size: 2.8rem;
}

.entry-content {
    overflow-wrap: break-word;
}

.entry-content iframe {
    max-width: 100%;
}

.entry + .entry {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #e5e5e5;
}

/* Footer widgets — dark three-column bar */

.footer-widgets {
    background: var(--cb-footer);
    color: var(--cb-footer-ink);
    font-size: 12px;
    font-size: 1.2rem;
}

.footer-widgets-grid {
    display: flex;
    gap: 0;
    padding: 30px 8px 16px;
}

.footer-col {
    flex: 1 1 0;
    padding: 0 2.8%;
    min-width: 0;
}

.footer-widgets .widget-title {
    color: #ffffff;
    margin: 0 0 14px;
}

.footer-col-body p,
.footer-col-body {
    color: var(--cb-footer-ink);
}

.footer-col-body p {
    margin: 0 0 0.8em;
}

.footer-col-body a {
    color: #ffffff;
}

.site-footer {
    background: var(--cb-bg);
    color: var(--cb-ink);
    font-size: 12px;
    font-size: 1.2rem;
    text-align: center;
    text-transform: uppercase;
    padding: 20px 0;
}

.site-footer p {
    margin: 0;
}

.site-footer a {
    color: var(--cb-ink);
}

/* Alignments used in imported page HTML */

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.alignleft {
    float: left;
    margin: 0 24px 12px 0;
}

.alignright {
    float: right;
    margin: 0 0 12px 24px;
}

/* Responsive */

@media (max-width: 800px) {
    .cb-slide-caption {
        display: none;
    }

    .cb-slider-dots {
        left: 16px;
    }

    .home-middle,
    .footer-widgets-grid {
        flex-direction: column;
        gap: 28px;
    }

    .content-area {
        padding: 24px 20px;
    }

    .cb-slide-image img {
        height: 240px;
    }

    .home-slider {
        max-height: 240px;
    }
}

@media (max-width: 600px) {
    .menu-primary a {
        padding: 12px 14px;
        font-size: 13px;
    }

    .site-logo {
        max-width: 200px;
        height: auto;
    }
}