/* Kinosphere — dark mobile-first (orange edition v2) */

/* ─────────────────────────────────────────────────────
   ПАЛИТРА (правится в одном месте)
   ───────────────────────────────────────────────────── */
:root{
    /* фон — тёплый уголь вместо холодного сине-серого */
    --bg:#100c09;
    --bg-deep:#0a0706;
    --surface:#1a1411;
    --surface-2:#241b16;
    --border:#33261e;
    --border-2:#46352a;

    /* текст */
    --text:#f2ebe4;
    --text-2:#cfc3b8;
    --muted:#93857a;

    /* акцент — оранжевый */
    --accent:#ff7a1a;
    --accent-2:#ffab3d;
    --accent-dark:#d95f00;
    --accent-soft:rgba(255,122,26,.13);
    --accent-line:linear-gradient(90deg,#ff7a1a,#ffab3d);
    --accent-fill:linear-gradient(135deg,#ff7a1a 0%,#e35d00 100%);

    /* сервисные */
    --radius:12px;
    --radius-sm:8px;
    --shadow:0 10px 26px rgba(0,0,0,.55);
    --glow:0 6px 20px rgba(255,122,26,.28);
}

/* ─────────────────────────────────────────────────────
   RESET / BASE
   ───────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
body{
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
    font-size:15px;
    line-height:1.55;
    color:var(--text);
    background:var(--bg);
    background-image:
        radial-gradient(900px 420px at 50% -180px,rgba(255,122,26,.10),transparent 70%);
    background-repeat:no-repeat;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeSpeed;
    overflow-x:hidden;
    max-width:100vw;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--accent-2);text-decoration:none;transition:color .15s}
a:hover{color:var(--accent)}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.25;font-weight:800;color:#fff;overflow-wrap:anywhere}
h1{font-size:1.42rem;letter-spacing:-.01em}
h2{font-size:1.15rem}
h3{font-size:1rem}
p{margin:0 0 .8em;overflow-wrap:anywhere}
ul,ol{margin:0 0 .8em;padding-left:1.2em}
::selection{background:var(--accent);color:#fff}

/* ─────────────────────────────────────────────────────
   ШАПКА
   ───────────────────────────────────────────────────── */
.site-header{
    position:sticky;top:0;z-index:100;
    background:rgba(16,12,9,.94);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border);
}
/* тонкая оранжевая линия под шапкой — вместо плоской границы */
.site-header::after{
    content:"";
    position:absolute;left:0;right:0;bottom:-1px;height:2px;
    background:var(--accent-line);
    opacity:.85;
}
.site-header-inner{
    max-width:1140px;margin:0 auto;
    display:flex;align-items:center;gap:10px;
    flex-wrap:wrap;
    padding:11px 14px;
}
.site-logo{
    font-weight:900;font-size:1.2rem;
    color:#fff;letter-spacing:.4px;
    flex-shrink:0;
    text-transform:uppercase;
}
/* первая буква — в оранжевой плашке */
.site-logo span{
    display:inline-block;
    background:var(--accent-fill);
    color:#fff;
    width:1.55em;height:1.55em;
    line-height:1.55em;
    text-align:center;
    border-radius:8px;
    margin-right:5px;
    box-shadow:var(--glow);
}

/* Мобильное меню — toggle */
.menu-toggle{
    margin-left:auto;
    background:var(--surface);border:1px solid var(--border-2);
    color:var(--text);padding:7px 11px;border-radius:9px;
    font-size:18px;line-height:1;
    display:flex;align-items:center;
    transition:border-color .15s,color .15s;
}
.menu-toggle:hover{border-color:var(--accent);color:var(--accent-2)}

/* Десктоп — меню в линию */
.main-nav{flex:1;min-width:0}
.main-nav ul{
    list-style:none;margin:0;padding:0;
    display:none;
    gap:2px;
}
.main-nav a{
    display:block;padding:8px 12px;
    color:var(--text-2);font-weight:600;font-size:.92rem;
    border-radius:8px;
    position:relative;
}
.main-nav a:hover,.main-nav .current-menu-item > a,.main-nav .current_page_item > a{
    background:var(--accent-soft);color:var(--accent-2);
}
/* подчёркивание активного пункта */
.main-nav .current-menu-item > a::before,
.main-nav .current_page_item > a::before{
    content:"";
    position:absolute;left:12px;right:12px;bottom:3px;height:2px;
    background:var(--accent);border-radius:2px;
}

/* Стрелка у пунктов с дочерними */
.main-nav .menu-item-has-children > a::after{
    content:" ▾";
    font-size:.75em;
    color:var(--accent);
    margin-left:2px;
}

/* Поиск */
.site-search{
    display:flex;gap:6px;
    flex:1;max-width:290px;margin-left:auto;
    min-width:0;
}
.site-search input{
    flex:1;
    padding:8px 13px;
    background:var(--surface);border:1px solid var(--border-2);
    color:var(--text);border-radius:9px;
    font-size:.9rem;
    min-width:0;
    transition:border-color .15s,box-shadow .15s;
}
.site-search input::placeholder{color:var(--muted)}
.site-search input:focus{
    outline:none;border-color:var(--accent);
    box-shadow:0 0 0 3px var(--accent-soft);
}
.site-search button{
    background:var(--accent-fill);color:#fff;border:0;
    padding:8px 15px;border-radius:9px;font-weight:700;font-size:.9rem;
    transition:filter .15s,transform .12s;
}
.site-search button:hover{filter:brightness(1.1)}
.site-search button:active{transform:translateY(1px)}

/* Мобильное поведение шапки: поиск на отдельной строке во всю ширину */
@media(max-width:767px){
    .main-nav{flex:0 0 auto}
    .site-search{
        order:10;
        flex:1 1 100%;
        max-width:100%;
        margin:6px 0 0;
    }
    .site-search input{
        padding:10px 14px;
        font-size:1rem;  /* предотвращает auto-zoom на iOS */
    }
    .site-search button{
        padding:10px 16px;
    }
}

/* На десктопе раскрываем меню и убираем тогл */
@media(min-width:768px){
    .main-nav > ul{display:flex}
    .menu-toggle{display:none}

    /* Dropdown подменю при ховере */
    .main-nav li{position:relative}
    .main-nav .sub-menu{
        position:absolute;
        top:100%;left:0;
        min-width:230px;
        background:var(--bg-deep);
        border:1px solid var(--border-2);
        border-top:2px solid var(--accent);
        border-radius:0 0 10px 10px;
        padding:5px;
        margin:0;
        list-style:none;
        display:none;
        box-shadow:var(--shadow);
        z-index:50;
    }
    .main-nav li:hover > .sub-menu,
    .main-nav li:focus-within > .sub-menu{
        display:block;
    }
    .main-nav .sub-menu a{
        display:block;
        padding:8px 12px;
        font-size:.88rem;
        white-space:nowrap;
        color:var(--text-2);
        border-radius:6px;
    }
    .main-nav .sub-menu a:hover{
        background:var(--accent-soft);color:var(--accent-2);
    }
}

/* Мобильное раскрытие меню */
.main-nav.is-open > ul{
    display:flex;
    flex-direction:column;
    position:absolute;top:100%;left:0;right:0;
    background:var(--bg-deep);
    border-bottom:1px solid var(--border);
    padding:8px 14px;
    gap:0;
    max-height:calc(100vh - 60px);
    overflow-y:auto;
    box-shadow:var(--shadow);
}
.main-nav.is-open a{
    padding:12px 8px;
    border-bottom:1px solid var(--border);
    border-radius:0;
}
.main-nav.is-open .current-menu-item > a::before{display:none}
/* На мобильном подменю — всегда раскрыто с отступом */
.main-nav.is-open .sub-menu{
    list-style:none;
    padding:0 0 0 16px;
    margin:0;
    display:block;
    border-left:2px solid var(--accent-soft);
}
.main-nav.is-open .sub-menu a{
    font-size:.88rem;
    color:var(--accent-2);
}

/* ─────────────────────────────────────────────────────
   КОНТЕЙНЕР
   ───────────────────────────────────────────────────── */
.site-main{
    max-width:1140px;margin:0 auto;
    padding:20px 14px 34px;
    overflow-x:hidden;
}
/* Заголовок секции: оранжевая планка слева + капс */
.section-title{
    display:flex;align-items:center;justify-content:space-between;
    gap:10px;
    margin:26px 0 13px;
    font-size:1.02rem;font-weight:800;
    color:#fff;
    text-transform:uppercase;
    letter-spacing:.06em;
    padding-left:11px;
    position:relative;
}
.section-title::before{
    content:"";
    position:absolute;left:0;top:.15em;bottom:.15em;
    width:4px;border-radius:3px;
    background:var(--accent-line);
}
.section-title a{
    font-size:.76rem;font-weight:700;
    color:var(--accent-2);
    text-transform:none;
    letter-spacing:0;
    white-space:nowrap;
    padding:4px 10px;
    border:1px solid var(--border-2);
    border-radius:999px;
    transition:border-color .15s,background .15s;
}
.section-title a:hover{border-color:var(--accent);background:var(--accent-soft)}

/* ─────────────────────────────────────────────────────
   СЕТКА КАРТОЧЕК (для рубрик/поиска/архивов)
   ───────────────────────────────────────────────────── */
.card-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
}
@media(min-width:480px){.card-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:768px){.card-grid{grid-template-columns:repeat(4,1fr);gap:15px}}
@media(min-width:1024px){.card-grid{grid-template-columns:repeat(5,1fr)}}
@media(min-width:1200px){.card-grid{grid-template-columns:repeat(6,1fr)}}

/* ─────────────────────────────────────────────────────
   КАРТОЧКА ФИЛЬМА
   ───────────────────────────────────────────────────── */
.card{
    display:block;
    position:relative;
    color:var(--text);
    min-width:0;
    transition:transform .2s ease;
}
.card:hover{transform:translateY(-4px)}
.card-poster{
    position:relative;
    aspect-ratio:2/3;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius);
    overflow:hidden;
    transition:border-color .2s,box-shadow .2s;
}
.card:hover .card-poster{
    border-color:var(--accent);
    box-shadow:var(--glow);
}
.card-poster img{
    width:100%;height:100%;object-fit:cover;display:block;
    transition:transform .3s ease;
}
.card:hover .card-poster img{transform:scale(1.05)}
/* затемнение снизу постера — рейтинг читается на любой обложке */
.card-poster::after{
    content:"";
    position:absolute;left:0;right:0;bottom:0;height:42%;
    background:linear-gradient(to top,rgba(10,7,6,.85),transparent);
    pointer-events:none;
}
/* рейтинг переехал вниз-влево */
.card-rating{
    position:absolute;bottom:7px;left:7px;z-index:2;
    background:rgba(10,7,6,.8);
    color:#fff;
    padding:3px 8px;border-radius:999px;
    font-size:.78rem;font-weight:800;
    line-height:1.15;
    border:1px solid rgba(255,255,255,.14);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
}
.card-rating.r-hi{background:rgba(255,122,26,.95);color:#fff;border-color:transparent}
.card-rating.r-mid{background:rgba(255,171,61,.95);color:#241b16;border-color:transparent}
.card-rating.r-lo{background:rgba(120,98,86,.95);color:#fff;border-color:transparent}

.card-title{
    margin:8px 2px 2px;
    font-size:.86rem;font-weight:700;
    color:var(--text);
    line-height:1.3;
    display:-webkit-box;
    -webkit-line-clamp:2;-webkit-box-orient:vertical;
    overflow:hidden;
    overflow-wrap:anywhere;
    transition:color .15s;
}
.card-meta{
    margin:0 2px;
    font-size:.76rem;color:var(--muted);
    text-transform:lowercase;
}
.card:hover .card-title{color:var(--accent-2)}

/* ─────────────────────────────────────────────────────
   КАРУСЕЛЬ (главная)
   ───────────────────────────────────────────────────── */
.carousel-wrap{
    position:relative;
}
.carousel{
    display:flex;
    gap:12px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    padding:4px 0 14px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
}
.carousel::-webkit-scrollbar{display:none}
.carousel .card{
    flex:0 0 40%;
    scroll-snap-align:start;
}
@media(min-width:480px){.carousel .card{flex:0 0 28%}}
@media(min-width:768px){.carousel .card{flex:0 0 21%}}
@media(min-width:1024px){.carousel .card{flex:0 0 17%}}

/* Кнопки прокрутки — круглые (только десктоп) */
.carousel-nav{
    position:absolute;
    top:38%;
    transform:translateY(-50%);
    width:44px;height:44px;
    border:1px solid var(--border-2);
    border-radius:50%;
    background:rgba(16,12,9,.9);
    color:#fff;
    font-size:24px;
    line-height:1;
    cursor:pointer;
    z-index:5;
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    transition:background .15s,opacity .15s,border-color .15s;
    display:none;
    align-items:center;
    justify-content:center;
    user-select:none;
    padding:0 0 3px 0;
    box-shadow:var(--shadow);
}
.carousel-nav:hover{
    background:var(--accent-fill);
    border-color:transparent;
}
.carousel-prev{left:-6px}
.carousel-next{right:-6px}
.carousel-nav[disabled]{opacity:.25;cursor:default;pointer-events:none}
@media(min-width:768px){
    .carousel-nav{display:flex}
}

/* Градиент справа — намекает на скролл (только мобильный) */
.carousel-wrap::after{
    content:"";
    position:absolute;
    top:0;bottom:14px;right:0;
    width:34px;
    background:linear-gradient(to left,var(--bg),transparent);
    pointer-events:none;
    z-index:2;
}
@media(min-width:768px){
    .carousel-wrap::after{display:none}
}

/* ─────────────────────────────────────────────────────
   ПАГИНАЦИЯ
   ───────────────────────────────────────────────────── */
.pagination,.nav-links{
    display:flex;flex-wrap:wrap;
    justify-content:center;gap:6px;
    margin:28px 0 8px;
}
.pagination .page-numbers,.nav-links .page-numbers{
    display:inline-block;
    padding:8px 13px;
    border:1px solid var(--border-2);border-radius:999px;
    color:var(--text-2);font-weight:700;font-size:.9rem;
    background:var(--surface);
    min-width:40px;text-align:center;
    transition:all .15s;
}
.pagination a.page-numbers:hover,.nav-links a.page-numbers:hover{
    background:var(--accent-soft);border-color:var(--accent);color:var(--accent-2);
}
.pagination .page-numbers.current,.nav-links .page-numbers.current{
    background:var(--accent-fill);border-color:transparent;color:#fff;
    box-shadow:var(--glow);
}
.pagination .page-numbers.dots,.nav-links .page-numbers.dots{border:none;background:transparent}

/* ─────────────────────────────────────────────────────
   ОДИНОЧНЫЙ ПОСТ
   ───────────────────────────────────────────────────── */
.entry{min-width:0}
.entry-header{margin-bottom:14px}
.entry-title{
    font-size:1.45rem;
    margin:0 0 8px;
    overflow-wrap:anywhere;
}
.entry-meta{
    color:var(--muted);font-size:.87rem;
    display:flex;flex-wrap:wrap;gap:9px;
    align-items:center;
}
.entry-meta .meta-rating{
    background:var(--accent-fill);color:#fff;
    padding:3px 10px;border-radius:999px;font-weight:800;
    font-size:.82rem;
    box-shadow:var(--glow);
}

/* Плеер */
.player-wrap{
    margin:0 0 16px;
    border-radius:var(--radius);overflow:hidden;
    background:#000;
    border:1px solid var(--border);
}

/* Информация о фильме */
.film-info{
    display:grid;
    grid-template-columns:130px 1fr;
    gap:15px;
    margin:18px 0;
    padding:15px;
    background:var(--surface);
    border:1px solid var(--border);
    border-left:3px solid var(--accent);
    border-radius:var(--radius);
    min-width:0;
}
@media(max-width:480px){
    .film-info{grid-template-columns:92px 1fr;gap:11px;padding:12px}
}
.film-info-poster{
    aspect-ratio:2/3;background:var(--bg-deep);
    border-radius:var(--radius-sm);overflow:hidden;
    min-width:0;
}
.film-info-poster img{width:100%;height:100%;object-fit:cover}
.film-info-data{
    font-size:.9rem;line-height:1.55;
    min-width:0;
    overflow-wrap:anywhere;
}
.film-info-data dt{
    color:var(--muted);font-weight:500;
    display:inline-block;min-width:90px;
}
.film-info-data dd{display:inline;margin:0;color:var(--text)}
.film-info-data .info-row{margin:4px 0}
@media(max-width:480px){
    .film-info-data{font-size:.85rem}
    .film-info-data dt{min-width:74px;font-size:.83rem}
}

.entry-content{
    font-size:.95rem;
    line-height:1.65;
    color:var(--text-2);
    margin:16px 0;
    overflow-wrap:anywhere;
}
.entry-content p{margin:0 0 .8em}

/* Актёры / режиссёр */
.cast-block{margin:18px 0}
.cast-block h3{
    font-size:.95rem;font-weight:800;color:#fff;
    margin:0 0 8px;
    text-transform:uppercase;
    letter-spacing:.05em;
}
.cast-list{
    display:flex;flex-wrap:wrap;gap:6px;
    font-size:.86rem;color:var(--text-2);
}
.cast-list span{
    background:var(--surface);border:1px solid var(--border);
    padding:5px 11px;border-radius:999px;
    max-width:100%;
    overflow-wrap:anywhere;
}
.cast-list .role{color:var(--accent-2);font-size:.78rem;margin-left:4px}

/* Шаблон статической страницы */
.static-page .entry-content{font-size:1rem}

/* ─────────────────────────────────────────────────────
   ПОДВАЛ
   ───────────────────────────────────────────────────── */
.site-footer{
    margin-top:34px;
    padding:20px 14px 24px;
    background:var(--bg-deep);
    border-top:1px solid var(--border);
    color:var(--muted);
    font-size:.83rem;
    text-align:center;
    position:relative;
}
.site-footer::before{
    content:"";
    position:absolute;left:0;right:0;top:-1px;height:2px;
    background:var(--accent-line);
    opacity:.55;
}
.site-footer a{color:var(--accent-2)}

/* ─────────────────────────────────────────────────────
   404 / ПУСТЫЕ СТРАНИЦЫ
   ───────────────────────────────────────────────────── */
.empty-state{
    text-align:center;padding:44px 20px;
    color:var(--muted);
}
.empty-state h2{color:#fff;margin-bottom:10px}
.empty-state a{
    display:inline-block;
    margin-top:14px;
    padding:10px 18px;
    background:var(--accent-fill);color:#fff;border-radius:999px;
    font-weight:700;
    box-shadow:var(--glow);
    transition:filter .15s;
}
.empty-state a:hover{filter:brightness(1.1);color:#fff}

/* ─────────────────────────────────────────────────────
   УТИЛИТЫ
   ───────────────────────────────────────────────────── */
.screen-reader-text{
    border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
    height:1px;margin:-1px;overflow:hidden;padding:0;
    position:absolute;width:1px;word-wrap:normal!important;
}