/*
Theme Name: dds_hotelsell.ru
Theme URI: https://hotelsell.ru/
Author: Зуева Арина
Author URI: https://hotelsell.ru/
Description: Тема для сайта «Туризм и отели: куда поехать, как выбрать». Подбор направлений и отелей, советы путешественникам, обзоры курортов, лайфхаки для комфортного и выгодного отдыха.
Version: 1.1
Requires at least: 6.0
Tested up to: 6.5
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: hsell
*/

/* =========================
   Базовые переменные и сброс
   ========================= */
:root{
    --bg-page:#fef7e8;
    --bg-card:#ffffff;
    --bg-footer:#2d3e50;
    --accent:#c36f4a;
    --accent-dark:#a85d3c;
    --accent-soft:#e3b87c;
    --olive:#6f8f6b;
    --olive-dark:#5b785a;
    --text:#2b2a28;
    --muted:#7d7a77;
    --line:#ece2cd;
    --shadow:0 6px 18px rgba(54,40,28,.08);
    --shadow-strong:0 10px 28px rgba(54,40,28,.14);
    --radius:8px;
    --maxw:1200px;
    --font-head:'Manrope','Inter','Helvetica Neue',Arial,sans-serif;
    --font-body:'Lora','Cormorant Garamond',Georgia,'Times New Roman',serif;
}

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

html{scroll-behavior:smooth}

body{
    margin:0;
    font-family:var(--font-body);
    font-size:17px;
    line-height:1.65;
    color:var(--text);
    background:var(--bg-page);
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

img{max-width:100%;height:auto}

a{color:var(--accent);text-decoration:none;transition:color .2s ease}
a:hover{color:var(--accent-dark);text-decoration:underline}

p{margin:0 0 1em}

h1,h2,h3,h4,h5,h6{
    font-family:var(--font-head);
    font-weight:700;
    line-height:1.25;
    color:var(--text);
    margin:1.4em 0 .55em;
}
h1{font-size:2.05rem}
h2{font-size:1.6rem}
h3{font-size:1.3rem}
h4{font-size:1.13rem}
h5{font-size:1rem}
h6{font-size:.92rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}

ul,ol{padding-left:1.4em}
li{margin:.25em 0}

blockquote{
    margin:1.2em 0;
    padding:1em 1.2em;
    border-left:4px solid var(--accent);
    background:#fbf0d9;
    font-style:italic;
    border-radius:0 var(--radius) var(--radius) 0;
}

code,pre{
    font-family:Menlo,Monaco,Consolas,monospace;
    background:#f5ecd6;
    border-radius:4px;
    padding:.1em .35em;
    font-size:.9em;
}
pre{padding:1em;overflow:auto}

table{
    width:100%;
    border-collapse:collapse;
    margin:1.2em 0;
    border:1px solid var(--line);
    background:#fff;
}
th,td{
    border:1px solid var(--line);
    padding:.55em .75em;
    text-align:left;
    vertical-align:top;
}
th{background:#fbf0d9;font-family:var(--font-head);font-weight:700}

/* =========================
   Layout / контейнер
   ========================= */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.site-main{padding:32px 0 60px;min-height:50vh}

.layout{display:flex;gap:36px;align-items:flex-start}
.layout > .content{flex:1 1 auto;min-width:0}
.layout > aside{flex:0 0 27%}

.layout.no-sidebar > .content{max-width:85%;margin:0 auto;flex:1 1 auto}

/* =========================
   Шапка
   ========================= */
.site-header{
    background:var(--bg-card);
    border-bottom:1px solid var(--line);
    box-shadow:var(--shadow);
}
.header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:18px 0;
}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand:hover{text-decoration:none}
.brand-logo{width:54px;height:54px;border-radius:10px;display:block}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-name{
    font-family:var(--font-head);
    font-weight:800;
    font-size:1.08rem;
    color:var(--text);
}
.brand-tagline{
    font-size:.82rem;
    color:var(--muted);
    margin-top:2px;
    max-width:430px;
}

/* Меню */
.nav-toggle{
    display:none;
    background:transparent;
    border:1px solid var(--line);
    border-radius:var(--radius);
    width:42px;height:42px;
    cursor:pointer;
    align-items:center;
    justify-content:center;
}
.nav-toggle span{
    display:block;width:20px;height:2px;background:var(--text);
    position:relative;
}
.nav-toggle span::before,
.nav-toggle span::after{
    content:'';position:absolute;left:0;width:20px;height:2px;background:var(--text);
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}

.primary-nav ul{
    list-style:none;
    margin:0;padding:0;
    display:flex;gap:6px;flex-wrap:wrap;
}
.primary-nav li{margin:0}
.primary-nav a{
    display:inline-block;
    padding:8px 14px;
    color:var(--text);
    font-family:var(--font-head);
    font-weight:600;
    border-radius:var(--radius);
    transition:background .2s ease,color .2s ease;
}
.primary-nav a:hover,
.primary-nav .current-menu-item > a,
.primary-nav .current_page_item > a{
    background:#fbf0d9;
    color:var(--accent-dark);
    text-decoration:none;
}

/* =========================
   Кнопки
   ========================= */
.btn{
    display:inline-block;
    padding:11px 22px;
    background:var(--accent);
    color:#fff;
    border:1px solid transparent;
    border-radius:var(--radius);
    font-family:var(--font-head);
    font-weight:600;
    cursor:pointer;
    transition:all .2s ease;
    text-decoration:none;
    line-height:1.2;
}
.btn:hover{
    background:var(--accent-dark);
    color:#fff;
    border-color:var(--accent-soft);
    text-decoration:none;
}
.btn-wide{padding:12px 28px}
.btn-olive{background:var(--olive);color:#fff}
.btn-olive:hover{background:var(--olive-dark);border:1px dashed var(--olive-dark);color:#fff}
.btn-ghost{
    background:transparent;
    color:var(--accent);
    border:1px solid var(--accent);
}
.btn-ghost:hover{background:var(--accent);color:#fff}

/* =========================
   Хлебные крошки
   ========================= */
.crumbs{
    font-size:.88rem;
    color:var(--muted);
    margin:18px 0 18px;
}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--accent)}
.crumbs .sep{margin:0 6px;color:var(--muted)}
.crumbs .current{color:var(--text);font-weight:600}

/* =========================
   Карточки записей
   ========================= */
.cards-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
    margin:24px 0;
}

.card{
    display:flex;
    flex-direction:column;
    background:var(--bg-card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    transition:transform .25s ease,box-shadow .25s ease;
    box-shadow:var(--shadow);
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-strong)}

.card-thumb{
    display:block;
    width:100%;
    aspect-ratio:16 / 10;
    object-fit:cover;
}
img.card-thumb{display:block}

.card-body{
    flex:1;
    padding:18px 20px 20px;
    display:flex;
    flex-direction:column;
}
.card-meta{
    font-size:.82rem;
    color:var(--muted);
    margin-bottom:6px;
    display:flex;gap:10px;flex-wrap:wrap;
}
.card-meta .cat{color:var(--olive-dark);font-weight:600}
.card-title{
    font-family:var(--font-head);
    font-weight:700;
    font-size:1.18rem;
    margin:0 0 8px;
    line-height:1.3;
}
.card-title a{color:var(--text)}
.card-title a:hover{color:var(--accent);text-decoration:none}

.card-excerpt{color:var(--text);font-size:.96rem}
.card-excerpt p{margin:0 0 .5em;background:none}

.card-foot{
    margin-top:14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

/* Горизонтальная карточка (для списков в архивах) */
.card-row{
    display:flex;
    flex-direction:row;
}
.card-row .card-thumb-wrap{
    flex:0 0 280px;
    position:relative;
    overflow:hidden;
}
.card-row .card-thumb-wrap a{
    display:block;
    position:absolute;
    top:0;left:0;right:0;bottom:0;
}
.card-row .card-thumb-wrap img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.card-row .card-body{flex:1}

/* =========================
   Сайдбар / виджеты
   ========================= */
.widget{
    background:var(--bg-card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:20px;
    margin-bottom:22px;
    box-shadow:var(--shadow);
}
.widget-title{
    font-family:var(--font-head);
    font-weight:700;
    font-size:1.1rem;
    margin:0 0 12px;
    padding-bottom:8px;
    border-bottom:2px solid var(--accent);
    display:inline-block;
}
.widget ul{list-style:none;padding:0;margin:0}
.widget li{
    padding:8px 0;
    border-bottom:1px dashed var(--line);
}
.widget li:last-child{border-bottom:0}
.widget a{color:var(--text)}
.widget a:hover{color:var(--accent);text-decoration:none}

.widget-search input[type="search"]{
    width:100%;
    padding:10px 12px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    font:inherit;
    margin-bottom:8px;
}

/* =========================
   Главная: тематические блоки
   ========================= */
.hero{
    background:linear-gradient(135deg,#fbe9c8 0%,#f6e1bd 50%,#fef7e8 100%);
    border-radius:14px;
    padding:48px 40px;
    margin:24px 0 36px;
    box-shadow:var(--shadow);
}
.hero h1{margin-top:0;font-size:2.4rem;max-width:760px}
.hero p.lead{font-size:1.12rem;max-width:680px;color:var(--text)}

.search-assistant{
    margin-top:20px;
    background:#fff;
    border-radius:var(--radius);
    padding:18px 22px;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
    font-size:1.05rem;
    line-height:1.8;
}
.search-assistant .ph{
    display:inline-block;
    background:#fbf0d9;
    border-bottom:2px dashed var(--accent);
    color:var(--accent-dark);
    padding:0 8px;
    border-radius:4px;
    font-weight:600;
}

.section-block{
    margin:48px 0;
}
.section-block h2{
    margin-top:0;
    font-size:1.85rem;
    position:relative;
    padding-bottom:10px;
}
.section-block h2::after{
    content:'';
    display:block;
    width:64px;
    height:3px;
    background:var(--accent);
    margin-top:10px;
    border-radius:2px;
}
.section-lead{
    color:var(--muted);
    font-size:1.04rem;
    max-width:780px;
    margin-bottom:18px;
}

/* Сетка чек-карточек / шагов внутри тематических блоков */
.feature-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    margin-top:18px;
}
.feature{
    background:#fff;
    padding:22px 22px 24px;
    border-radius:var(--radius);
    border:1px solid var(--line);
    box-shadow:var(--shadow);
}
.feature .icon{
    width:46px;height:46px;
    border-radius:50%;
    background:#fbf0d9;
    display:flex;align-items:center;justify-content:center;
    margin-bottom:12px;
    font-size:1.4rem;
    color:var(--accent);
}
.feature h3{margin:.2em 0 .35em;font-size:1.12rem}
.feature p{margin:0;font-size:.95rem;color:var(--text)}

/* Индекс комфорта */
.comfort-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    margin-top:18px;
}
.comfort{
    background:#fff;
    border-radius:var(--radius);
    border:1px solid var(--line);
    padding:18px 20px;
    box-shadow:var(--shadow);
}
.comfort h3{margin:0 0 12px;font-size:1.08rem}
.comfort .row{
    display:flex;
    align-items:center;
    gap:10px;
    margin:8px 0;
    font-size:.92rem;
}
.comfort .row .lbl{flex:0 0 110px;color:var(--muted)}
.comfort .row .bar{
    flex:1;
    height:8px;
    background:#f0e6cf;
    border-radius:4px;
    overflow:hidden;
    position:relative;
}
.comfort .row .bar > span{
    display:block;height:100%;
    background:linear-gradient(90deg,var(--accent),var(--olive));
    border-radius:4px;
}
.comfort .row .val{flex:0 0 32px;text-align:right;font-weight:600}

/* =========================
   Подвал
   ========================= */
.site-footer{
    background:var(--bg-footer);
    color:#dde4ec;
    padding:42px 0 18px;
    margin-top:50px;
}
.site-footer a{color:#fff}
.site-footer a:hover{color:var(--accent-soft)}
.footer-cols{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:32px;
    margin-bottom:30px;
}
.footer-col .widget{
    background:transparent;
    border:0;
    box-shadow:none;
    padding:0;
}
.footer-col .widget-title{
    color:#fff;
    border-bottom-color:var(--accent-soft);
}
.footer-col .widget li{
    border-bottom-color:rgba(255,255,255,.12);
}
.footer-col .widget a{color:#dde4ec}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.12);
    padding-top:18px;
    text-align:center;
    color:#bcc6d2;
    font-size:.92rem;
}

/* =========================
   Пагинация
   ========================= */
.pagination{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    justify-content:center;
    margin:34px 0 8px;
}
.pagination a,
.pagination span{
    display:inline-block;
    padding:8px 14px;
    border-radius:var(--radius);
    border:1px solid var(--line);
    background:#fff;
    color:var(--text);
    font-family:var(--font-head);
    font-weight:600;
    text-decoration:none;
    transition:all .2s ease;
}
.pagination a:hover{
    background:var(--accent);
    color:#fff;
    border-color:var(--accent);
}
.pagination .current{
    background:var(--accent);
    color:#fff;
    border-color:var(--accent);
}
.pagination .dots{background:transparent;border-color:transparent}

/* =========================
   Форма поиска
   ========================= */
.search-form{
    display:flex;
    gap:8px;
    max-width:520px;
}
.search-form input[type="search"]{
    flex:1;
    padding:11px 14px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    font:inherit;
    background:#fff;
}
.search-form button{
    padding:11px 22px;
    background:var(--accent);
    color:#fff;
    border:0;
    border-radius:var(--radius);
    font-family:var(--font-head);
    font-weight:600;
    cursor:pointer;
    transition:background .2s ease;
}
.search-form button:hover{background:var(--accent-dark)}

/* =========================
   Запись
   ========================= */
.entry-header{margin-bottom:22px}
.entry-title{margin:0 0 10px;font-size:2rem}
.entry-meta{
    color:var(--muted);
    font-size:.9rem;
    display:flex;gap:14px;flex-wrap:wrap;
}
.entry-meta .cat{color:var(--olive-dark);font-weight:600}
.entry-thumb{
    margin:0 0 22px;
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow);
}
.entry-thumb img{display:block;width:100%;height:auto}
.entry-content{font-size:1.04rem;line-height:1.78}
.entry-content img{border-radius:var(--radius)}
.entry-content figure{margin:1.4em 0}

.entry-tags{
    margin-top:24px;
    padding-top:16px;
    border-top:1px solid var(--line);
    font-size:.92rem;
    color:var(--muted);
}
.entry-tags a{
    display:inline-block;
    margin:2px 4px 2px 0;
    padding:3px 9px;
    background:#fbf0d9;
    border-radius:4px;
    color:var(--accent-dark);
}
.entry-tags a:hover{background:var(--accent);color:#fff;text-decoration:none}

/* =========================
   Комментарии
   ========================= */
.comments-area{
    margin-top:36px;
    padding-top:22px;
    border-top:1px solid var(--line);
}
.comments-area h2.comments-title{margin:0 0 18px;font-size:1.4rem}
.comments-area ol.comment-list{list-style:none;padding:0;margin:0 0 24px}
.comments-area .comment-body{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:14px 18px;
    margin-bottom:14px;
    box-shadow:var(--shadow);
}
.comments-area .children{list-style:none;padding-left:30px}
.comments-area .comment-author{font-weight:700;font-family:var(--font-head)}
.comments-area .comment-meta{font-size:.82rem;color:var(--muted);margin-bottom:6px}
.comments-area .reply{margin-top:6px;font-size:.88rem}

.comment-respond{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:18px 20px;
    box-shadow:var(--shadow);
}
.comment-form label{
    display:block;
    margin-top:10px;
    font-weight:600;
    font-family:var(--font-head);
    font-size:.92rem;
}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
    width:100%;
    padding:10px 12px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    font:inherit;
    margin-top:5px;
    background:#fcfaf3;
}
.comment-form textarea{min-height:120px;resize:vertical}
.comment-form .form-submit{margin-top:14px}

/* =========================
   404
   ========================= */
.not-found{
    text-align:center;
    padding:50px 20px;
}
.not-found .code{
    font-family:var(--font-head);
    font-size:6rem;
    font-weight:800;
    color:var(--accent);
    line-height:1;
    margin:0 0 6px;
}
.not-found h1{margin-top:.4em}
.not-found p{color:var(--muted);max-width:560px;margin:0 auto 20px}
.not-found .actions{margin:22px 0}

/* =========================
   Cookie-баннер
   ========================= */
.cookie-banner[hidden]{display:none !important}

.cookie-banner{
    position:fixed;
    left:16px;right:16px;bottom:16px;
    z-index:9999;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:var(--shadow-strong);
    border-radius:12px;
    padding:14px 18px;
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    max-width:760px;
    margin:0 auto;
}
.cookie-banner p{margin:0;flex:1 1 260px;font-size:.94rem;color:var(--text)}
.cookie-banner .btn{padding:9px 18px;font-size:.92rem}

/* =========================
   Утилиты
   ========================= */
.screen-reader-text{
    position:absolute !important;
    clip:rect(1px,1px,1px,1px);
    width:1px;height:1px;overflow:hidden;
}
.alignleft{float:left;margin:0 1.2em 1em 0}
.alignright{float:right;margin:0 0 1em 1.2em}
.aligncenter{display:block;margin:1em auto}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:.86rem;color:var(--muted);text-align:center;margin-top:4px}
.sticky{position:relative}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:1em 0}
.gallery .gallery-item{margin:0 !important;width:auto !important;max-width:none}

/* =========================
   Адаптив
   ========================= */
@media (max-width:960px){
    .layout{flex-direction:column}
    .layout > aside{flex:0 0 auto;width:100%}
    .layout.no-sidebar > .content{max-width:100%}
    .cards-grid{grid-template-columns:repeat(2,1fr)}
    .feature-grid{grid-template-columns:repeat(2,1fr)}
    .comfort-grid{grid-template-columns:1fr}
    .footer-cols{grid-template-columns:1fr 1fr;gap:24px}
    .hero{padding:36px 26px}
    .hero h1{font-size:1.8rem}
}

@media (max-width:600px){
    body{font-size:16px}
    .wrap{padding:0 16px}
    h1{font-size:1.6rem}
    h2{font-size:1.35rem}
    .header-inner{flex-wrap:wrap;gap:12px}
    .nav-toggle{display:flex}
    .primary-nav{
        flex-basis:100%;
        order:3;
        display:none;
    }
    .primary-nav.is-open{display:block}
    .primary-nav ul{flex-direction:column;gap:0;border-top:1px solid var(--line);padding-top:8px}
    .primary-nav li{width:100%}
    .primary-nav a{display:block;padding:10px 12px}
    .brand-tagline{display:none}
    .cards-grid{grid-template-columns:1fr;gap:18px}
    .feature-grid{grid-template-columns:1fr}
    .footer-cols{grid-template-columns:1fr;gap:24px}
    .gallery{grid-template-columns:repeat(2,1fr)}
    .hero{padding:28px 18px}
    .hero h1{font-size:1.55rem}
    .search-assistant{font-size:.98rem}

    /* Горизонтальные карточки → вертикаль (правило A10) */
    .card-row{flex-direction:column}
    .card-row .card-thumb-wrap{
        flex:none;
        width:100%;
        position:static;
    }
    .card-row .card-thumb-wrap a{position:static}
    .card-row .card-thumb-wrap img{
        width:100%;
        height:auto;
        aspect-ratio:16 / 9;
    }

    .btn{padding:13px 22px;width:auto}
    .cookie-banner{left:8px;right:8px;bottom:8px;padding:12px 14px}
}

/* =========================
   Анимация мягкого появления (правило дизайна)
   ========================= */
@media (prefers-reduced-motion:no-preference){
    .reveal{
        opacity:0;
        transform:translateY(14px);
        transition:opacity .55s ease,transform .55s ease;
    }
    .reveal.in{opacity:1;transform:translateY(0)}
}