/*
Theme Name: dds_topicaltank.com
Author: Дмитрий Воронов
Description: Тема для lifestyle-журнала и экспертной площадки по элитной недвижимости у воды.
Version: 1.2
Text Domain: topicaltank
*/

:root{
    --deep:#0c3a4a;
    --sea:#14697b;
    --aqua:#2fa5b5;
    --aqua-soft:#bfe2e6;
    --mist:#eef5f6;
    --paper:#ffffff;
    --ink:#14282f;
    --muted:#5a747d;
    --sand:#c7b083;
    --line:#d8e4e6;
    --shadow:0 10px 30px rgba(12,58,74,.10);
    --serif:"Iowan Old Style","Palatino Linotype",Georgia,"Times New Roman",serif;
    --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
    margin:0;
    font-family:var(--sans);
    color:var(--ink);
    background:var(--mist);
    line-height:1.65;
    font-size:17px;
    overflow-x:hidden;
}

h1,h2,h3,h4{
    font-family:var(--serif);
    line-height:1.22;
    color:var(--deep);
    margin:0 0 .5em;
    font-weight:600;
}
h1{font-size:2.15rem;}
h2{font-size:1.7rem;}
h3{font-size:1.28rem;}

p{margin:0 0 1.1em;}

a{color:var(--sea);text-decoration:none;}
a:hover{color:var(--aqua);text-decoration:underline;}

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

.shell{
    width:min(92%,1180px);
    margin-inline:auto;
}

.btn{
    display:inline-block;
    background:var(--aqua);
    color:#fff;
    padding:.7em 1.4em;
    border-radius:6px;
    font-weight:600;
    letter-spacing:.01em;
    transition:background .18s ease;
}
.btn:hover{background:var(--sea);color:#fff;text-decoration:none;}
.btn--ghost{background:transparent;border:1.5px solid var(--aqua);color:var(--deep);}
.btn--ghost:hover{background:var(--aqua);color:#fff;}

/* ---------- Site header ---------- */
.site-header{
    background:var(--paper);
    border-bottom:1px solid var(--line);
}
.site-header__inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.5rem;
    padding:1.1rem 0;
}
.brand{
    display:flex;
    align-items:center;
    gap:.9rem;
    min-width:0;
}
.brand__logo{display:block;flex:0 0 auto;}
.brand__logo img,.brand__logo svg{display:block;height:52px;width:auto;}
.brand__text{min-width:0;}
.brand__name{
    display:block;
    font-family:var(--serif);
    font-size:1.35rem;
    font-weight:600;
    color:var(--deep);
    line-height:1.15;
    max-width:34ch;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.brand__name:hover{text-decoration:none;}
.brand__desc{
    display:block;
    font-size:.82rem;
    color:var(--muted);
    max-width:52ch;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

/* ---------- Primary navigation (not sticky) ---------- */
.primary-nav{position:relative;}
.nav-toggle{
    display:none;
    background:none;
    border:1.5px solid var(--line);
    border-radius:6px;
    padding:.5rem .7rem;
    cursor:pointer;
    color:var(--deep);
    font-size:.95rem;
    align-items:center;
    gap:.45rem;
}
.nav-toggle__bars{display:inline-block;width:20px;height:2px;background:var(--deep);position:relative;}
.nav-toggle__bars::before,.nav-toggle__bars::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--deep);}
.nav-toggle__bars::before{top:-6px;}
.nav-toggle__bars::after{top:6px;}
.primary-nav__list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    gap:.4rem;
    flex-wrap:wrap;
}
.primary-nav__list a{
    display:block;
    padding:.55rem .85rem;
    color:var(--deep);
    font-weight:500;
    border-radius:6px;
}
.primary-nav__list a:hover{background:var(--mist);color:var(--sea);text-decoration:none;}
.primary-nav__list .current-menu-item>a{color:var(--aqua);}

/* ---------- Layout wrappers ---------- */
.site-main{padding:2.4rem 0 3rem;}
.layout-with-sidebar{
    display:grid;
    grid-template-columns:minmax(0,67fr) minmax(0,27fr);
    gap:2.4rem;
    align-items:start;
}
.layout-single .content-area{
    width:85%;
    margin-left:auto;
    margin-right:auto;
}
.content-area{min-width:0;}

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{
    font-size:.85rem;
    color:var(--muted);
    margin-bottom:1.4rem;
    display:flex;
    flex-wrap:wrap;
    gap:.35rem;
    align-items:center;
}
.breadcrumbs a{color:var(--sea);}
.breadcrumbs .sep{color:var(--aqua-soft);}

/* ---------- Front page sections ---------- */
.front-section{padding:2.8rem 0;}
.section-head{margin-bottom:1.6rem;}
.section-head .eyebrow{
    display:inline-block;
    text-transform:uppercase;
    letter-spacing:.14em;
    font-size:.72rem;
    color:var(--aqua);
    font-weight:700;
    margin-bottom:.5rem;
}

/* Split: text + illustration */
.split{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:2.6rem;
    align-items:center;
}
.split--flip .split__media{order:-1;}
.split__media img{
    display:block;
    width:100%;
    border-radius:14px;
    box-shadow:var(--shadow);
}
.split__body p:last-child{margin-bottom:0;}

/* Rubric card grid */
.rubrics{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1.4rem;
}
.rubric{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:12px;
    padding:1.6rem 1.5rem;
    min-width:0;
}
.rubric__icon{
    width:48px;height:48px;
    display:flex;align-items:center;justify-content:center;
    border-radius:12px;
    background:var(--mist);
    margin-bottom:1rem;
}
.rubric__icon svg{display:block;width:26px;height:26px;}
.rubric h3{margin-bottom:.4rem;}
.rubric p{margin:0;color:var(--muted);font-size:.96rem;}

/* Gallery / mosaic */
.mosaic{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    grid-auto-rows:150px;
    gap:.9rem;
}
.mosaic figure{
    margin:0;
    border-radius:12px;
    overflow:hidden;
    position:relative;
    background:var(--aqua-soft);
}
.mosaic figure img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}
.mosaic .tile-wide{grid-column:span 2;}
.mosaic .tile-tall{grid-row:span 2;}
.mosaic figcaption{
    position:absolute;
    left:0;right:0;bottom:0;
    padding:.6rem .8rem;
    font-size:.8rem;
    color:#fff;
    background:linear-gradient(to top,rgba(12,58,74,.78),rgba(12,58,74,0));
}

/* CTA */
.fs-cta{
    background:var(--deep);
    color:#eaf6f8;
    border-radius:16px;
    padding:3rem 2.6rem;
    text-align:center;
}
.fs-cta h2{color:#fff;}
.fs-cta p{color:#cfe6ea;max-width:60ch;margin-left:auto;margin-right:auto;}
.fs-cta .btn{margin-top:.6rem;background:#fff;color:var(--deep);}
.fs-cta .btn:hover{background:var(--aqua-soft);color:var(--deep);}

/* Latest posts on front */
.latest-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1.6rem;
}

/* ---------- Post cards ---------- */
.card{
    display:flex;
    flex-direction:column;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:12px;
    overflow:hidden;
    box-shadow:var(--shadow);
    min-width:0;
}
.card-thumb{
    display:block;
    aspect-ratio:16 / 10;
    overflow:hidden;
    background:var(--aqua-soft);
}
.card-thumb img{display:block;width:100%;height:100%;object-fit:cover;}
.card-body{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:1.3rem 1.4rem 1.5rem;
    min-width:0;
}
.card-meta{font-size:.78rem;color:var(--muted);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.05em;}
.card-title{font-size:1.2rem;margin:0 0 .55rem;}
.card-title a{color:var(--deep);}
.card-title a:hover{color:var(--sea);text-decoration:none;}
.card-excerpt{color:var(--muted);font-size:.96rem;}
.card-excerpt p{margin:0 0 .5em;background:none;}
.card-more{margin-top:auto;padding-top:.9rem;font-weight:600;color:var(--sea);}
.card-more a{color:var(--sea);}

/* Horizontal card (archive list variant) */
.card--row{flex-direction:row;}
.card--row .card-thumb-wrap{
    flex:0 0 260px;
    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;
}

/* ---------- Single / page content ---------- */
.entry{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:14px;
    padding:2.2rem 2.3rem;
}
.entry-header{margin-bottom:1.4rem;}
.entry-title{font-size:2rem;margin-bottom:.5rem;}
.entry-meta{font-size:.85rem;color:var(--muted);}
.entry-thumb{margin:0 0 1.6rem;border-radius:12px;overflow:hidden;}
.entry-thumb img{display:block;width:100%;}
.entry-content{min-width:0;}
.entry-content img{border-radius:10px;}
.entry-content h2{margin-top:1.6rem;}
.entry-content blockquote{
    margin:1.6rem 0;
    padding:1.2rem 1.5rem;
    background:var(--mist);
    border-left:4px solid var(--aqua);
    border-radius:0 10px 10px 0;
    color:var(--deep);
    font-style:italic;
}
.entry-content ul,.entry-content ol{padding-left:1.4rem;}

.entry-content table,.comment-content table{
    width:100%;
    border-collapse:collapse;
    margin:1.4rem 0;
}
.entry-content th,.entry-content td,.comment-content th,.comment-content td{
    border:1px solid var(--line);
    padding:.6rem .8rem;
    text-align:left;
}
.entry-content th{background:var(--mist);}

/* ---------- Sidebar (light bg -> dark text) ---------- */
.sidebar{min-width:0;}
.widget{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:12px;
    padding:1.4rem 1.5rem;
    margin-bottom:1.6rem;
    color:var(--ink);
}
.widget-title{
    font-size:1.05rem;
    color:var(--deep);
    margin:0 0 1rem;
    padding-bottom:.6rem;
    border-bottom:2px solid var(--aqua-soft);
}
.widget ul{list-style:none;margin:0;padding:0;}
.widget li{padding:.45rem 0;border-bottom:1px solid var(--line);}
.widget li:last-child{border-bottom:none;}
.widget a{color:var(--sea);}
.widget a:hover{color:var(--aqua);}
.widget .post-date,.widget .rss-date{color:var(--muted);font-size:.8rem;}

/* ---------- Footer ---------- */
.site-footer{
    background:var(--deep);
    color:#cfe6ea;
    padding:3rem 0 1.5rem;
}
.footer-cols{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:2rem;
}
.footer-col{min-width:0;}
.footer-col .widget{
    background:transparent;
    border:none;
    padding:0;
    margin:0;
    color:#cfe6ea;
}
.footer-col .widget-title{
    color:#fff;
    border-bottom-color:rgba(255,255,255,.18);
}
.footer-col .widget a{color:#bfe2e6;}
.footer-col .widget a:hover{color:#fff;}
.footer-col .widget li{border-bottom-color:rgba(255,255,255,.12);}
.footer-col .widget .post-date{color:#8fb6bf;}
.site-info{
    margin-top:2.4rem;
    padding-top:1.4rem;
    border-top:1px solid rgba(255,255,255,.15);
    font-size:.85rem;
    color:#9fc3cb;
}

/* ---------- Pagination (type => plain, style .page-numbers) ---------- */
.pagination{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
    margin-top:2.4rem;
    justify-content:center;
}
.pagination .page-numbers{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:42px;
    padding:.5rem .85rem;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--paper);
    color:var(--deep);
    font-weight:600;
    line-height:1;
}
.pagination a.page-numbers:hover{background:var(--mist);color:var(--sea);text-decoration:none;}
.pagination .page-numbers.current{
    background:var(--aqua);
    border-color:var(--aqua);
    color:#fff;
}
.pagination .page-numbers.dots{border:none;background:none;}

/* ---------- Comments ---------- */
.comments-area{
    margin-top:2rem;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:14px;
    padding:2rem 2.3rem;
}
.comment-list{list-style:none;margin:0;padding:0;}
.comment-list li{margin:0 0 1.2rem;}
.comment-body{
    background:var(--mist);
    border-radius:10px;
    padding:1.1rem 1.3rem;
}
.comment-list .children{list-style:none;margin:1rem 0 0 1.6rem;padding:0;}
.comment-author{font-weight:600;color:var(--deep);}
.comment-metadata{font-size:.8rem;color:var(--muted);margin-bottom:.5rem;}
.comment-respond{margin-top:1.8rem;}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
    width:100%;
    padding:.7rem .8rem;
    border:1px solid var(--line);
    border-radius:8px;
    font-family:inherit;
    font-size:1rem;
    margin-top:.3rem;
}
.comment-form p{margin-bottom:1rem;}
.comment-form .form-submit input{cursor:pointer;}

/* ---------- Search form ---------- */
.search-form{display:flex;gap:.5rem;}
.search-form input[type="search"]{
    flex:1;
    min-width:0;
    padding:.65rem .85rem;
    border:1px solid var(--line);
    border-radius:8px;
    font-size:1rem;
}
.search-form button,.search-form input[type="submit"]{
    background:var(--aqua);
    color:#fff;
    border:none;
    border-radius:8px;
    padding:.65rem 1.1rem;
    font-weight:600;
    cursor:pointer;
}

/* ---------- 404 ---------- */
.error-404{
    text-align:center;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:14px;
    padding:3rem 2.3rem;
}
.error-404 .code{font-size:4rem;color:var(--aqua);font-family:var(--serif);line-height:1;}
.error-404 .search-form{max-width:420px;margin:1.6rem auto 0;}

/* ---------- Cookie banner ---------- */
.cookie-banner[hidden]{display:none !important;}
.cookie-banner{
    position:fixed;
    left:0;right:0;bottom:0;
    z-index:50;
    background:var(--deep);
    color:#eaf6f8;
    padding:1rem 0;
    box-shadow:0 -6px 24px rgba(0,0,0,.18);
}
.cookie-banner__inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.4rem;
    flex-wrap:wrap;
}
.cookie-banner p{margin:0;font-size:.9rem;color:#cfe6ea;max-width:70ch;}
.cookie-banner a{color:#bfe2e6;text-decoration:underline;}
.cookie-banner .btn{white-space:nowrap;}

/* ---------- Responsive ---------- */
@media (max-width:960px){
    .layout-with-sidebar{grid-template-columns:1fr;}
    .rubrics{grid-template-columns:repeat(2,minmax(0,1fr));}
    .latest-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .mosaic{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:600px){
    body{font-size:16px;}
    h1{font-size:1.8rem;}
    h2{font-size:1.45rem;}
    .nav-toggle{display:inline-flex;}
    .primary-nav__list{
        display:none;
        position:absolute;
        top:calc(100% + .6rem);
        right:0;
        background:var(--paper);
        border:1px solid var(--line);
        border-radius:10px;
        box-shadow:var(--shadow);
        padding:.5rem;
        flex-direction:column;
        min-width:220px;
        z-index:40;
    }
    .primary-nav.nav-open .primary-nav__list{display:flex;}
    .brand__desc{display:none;}
    .brand__name{white-space:normal;font-size:1.15rem;}
    .split{grid-template-columns:1fr;gap:1.6rem;}
    .split--flip .split__media{order:0;}
    .rubrics{grid-template-columns:1fr;}
    .latest-grid{grid-template-columns:1fr;}
    .mosaic{grid-template-columns:1fr;grid-auto-rows:180px;}
    .mosaic .tile-wide,.mosaic .tile-tall{grid-column:auto;grid-row:auto;}
    .entry,.comments-area{padding:1.5rem 1.3rem;}
    .fs-cta{padding:2rem 1.4rem;}
    .layout-single .content-area{width:100%;}
    .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;}
}