/*
Theme Name: DBRevolution
Description: News and article theme for DBRevolution. Latest-posts grid with featured images, single article layout, hamburger menu on mobile, search, and a four-column footer driven by menus.
Version: 1.0.4
Requires at least: 5.9
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: dbrevolution
*/

:root{--navy:#1e3d80;--navy-d:#1b3a78;--sky:#3a93c1;--orange:#ff6b3d;--white:#fff;--muted:#7B8FB3;--wrap:1028px;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:#fff;color:var(--white);font-family:"Outfit",system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:6px}
.site{position:relative;overflow:hidden}
.wrap{width:min(var(--wrap),100% - 48px);margin-inline:auto;position:relative}

/* header */
.hd{height:209px;background:#fff}
.hd .wrap{height:100%}
#site-nav{display:flex;align-items:flex-start;gap:53px;height:62px}
#site-nav a{display:block;padding-top:20px;font-size:16px;font-weight:400;color:var(--muted);position:relative;line-height:24px;transition:color .15s}
#site-nav a:hover{color:var(--orange)}
.links{display:flex;gap:53px}
.burger{display:none}
#site-nav a[aria-current]{color:var(--navy);font-weight:700}
#site-nav a[aria-current]::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--navy)}
.search-toggle{margin-left:auto;margin-top:18px;width:30px;height:30px;color:var(--navy);display:grid;place-items:center;background:none;border:0;cursor:pointer}
.brand{position:absolute;left:237px;top:117px;width:327px}
.brand img{display:block;width:100%;height:auto}
.goku{position:absolute;left:604px;top:22px;width:190px;height:auto;z-index:3;pointer-events:none}

/* panel */
.panel{position:relative;z-index:1;padding:68px 0 270px;background:linear-gradient(180deg,#234480 0%,#296a9d 25%,#3091bb 50%,#37b7d8 75%,#3dddf6 100%)}
h1,.label{font-family:"Tektur",sans-serif;font-weight:500;font-size:24px;line-height:1;margin:0 0 54px;letter-spacing:.02em;text-transform:lowercase}
.grid{display:grid;grid-template-columns:repeat(3,1fr);column-gap:47px;row-gap:46px;margin:0;padding:0;list-style:none}
.card{display:block}
.thumb{aspect-ratio:311/186;background:#fff;border:2px solid #fff;border-radius:12px;overflow:hidden;transition:transform .2s}
.thumb img{display:block;width:100%;height:100%;object-fit:cover}
.card:hover .thumb{transform:translateY(-4px)}
.card h2{margin:16px 0 8px;font-size:22px;line-height:1.25;font-weight:600;letter-spacing:-.005em;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:4px;transition:text-decoration-color .15s}
.card:hover h2,.card:focus-visible h2{text-decoration-color:#fff}
.post-date{display:inline-block;background:var(--orange);color:#fff;font-size:15px;font-weight:500;line-height:1;padding:7px 10px;border-radius:7px;margin-left:3px;text-transform:uppercase}

.pager{display:flex;justify-content:center;align-items:center;gap:13px;margin-top:62px}
.pager button{font:inherit;font-weight:500;font-size:18px;color:#fff;border:0;cursor:pointer;height:50px;border-radius:9px;background:var(--sky);min-width:46px;transition:background .15s}
.pager button:hover{background:#2f7fae}
.pager .nav-btn{background:var(--navy);padding:0 22px;font-weight:600;display:inline-flex;align-items:center;gap:12px;min-width:0}
.pager .nav-btn:hover{background:#17306a}
.pager .nav-btn:first-child{margin-right:12px}
.pager .nav-btn:last-child{margin-left:12px}
.pager button[aria-current]{background:var(--navy)}
.pager button:disabled{opacity:.55;cursor:default}

/* buu + cloud (anchored to bottom edge of panel) */
.buuwrap{position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:min(var(--wrap),100% - 48px);height:0;z-index:4;pointer-events:none}
.buu{position:absolute;left:86px;bottom:-148px;width:195px;height:auto}
.bubble{position:absolute;left:0;bottom:92px;width:132px;font-size:13px}
.bubble img{display:block;width:100%;height:auto}
.bubble span{position:absolute;left:23%;top:37%;font:italic 800 1em/1.12 "Barlow Condensed","Arial Narrow",sans-serif;text-transform:uppercase;color:var(--navy);white-space:nowrap;letter-spacing:.01em}

/* footer */
.ft{position:relative;z-index:0;background:#fff;color:var(--navy)}
.ft-cols{display:grid;grid-template-columns:295px 312px 303px 1fr;padding:161px 0 80px 2px}
.ft h3{margin:0 0 24px;font-size:22px;line-height:1.2;font-weight:600}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.ft li a{font-size:18px;line-height:25px;font-weight:400;color:var(--muted);display:inline-block;transition:color .15s}
.ft li a:hover{color:var(--orange)}
.ft-bar{border-top:1px solid #dfe5ef;height:91px}
.ft-bar .wrap{height:100%;display:flex;align-items:center;justify-content:space-between}
.ft-bar p{margin:0 0 0 2px;font-size:14px;line-height:1.3;color:var(--navy)}
.ft-bar img{display:block;width:213px;height:auto}

@media (max-width:1100px){.grid{column-gap:28px}.card h2{font-size:19px}.brand{left:120px}.goku{left:490px}}
@media (max-width:820px){
 .ft-cols{grid-template-columns:repeat(2,1fr);row-gap:36px;padding-top:150px}
 .hd{height:190px}
 #site-nav{position:relative;z-index:30;align-items:center}
 .burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;margin-left:-11px;padding:0 11px;background:none;border:0;cursor:pointer}
 .burger span{display:block;height:2.5px;border-radius:2px;background:var(--navy);transition:transform .2s,opacity .2s}
 #site-nav.open .burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
 #site-nav.open .burger span:nth-child(2){opacity:0}
 #site-nav.open .burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
 .links{display:none;position:absolute;top:54px;left:-8px;min-width:220px;flex-direction:column;gap:2px;padding:8px;background:#fff;border-radius:16px;box-shadow:0 12px 32px rgba(20,40,90,.22)}
 #site-nav.open .links{display:flex}
 #site-nav a{font-size:16px;white-space:nowrap;padding:12px 16px;border-radius:10px}
 #site-nav a:hover{background:#eef3fb}
 #site-nav a[aria-current]::before{left:0;right:auto;top:10px;bottom:10px;width:4px;height:auto;border-radius:2px}
 .search-toggle{position:absolute;right:0;top:0;margin:0;height:62px;width:44px}
 .brand{left:0;top:100px;width:230px}
 .goku{left:auto;right:6px;top:auto;bottom:-24px;width:140px}
 .panel{padding-bottom:230px}
 .grid{grid-template-columns:repeat(2,1fr);column-gap:20px}
}
@media (max-width:560px){
 .grid{grid-template-columns:1fr}
 .brand{width:200px;top:112px}.goku{width:120px;bottom:-24px}
 .pager{flex-wrap:wrap;gap:8px}
 .pager .nav-btn{padding:0 14px}.pager .nav-btn:first-child,.pager .nav-btn:last-child{margin:0}
 .buu{left:10px;width:150px;bottom:-118px}.bubble{bottom:80px;width:112px;font-size:11px}.ft-cols{grid-template-columns:1fr 1fr;row-gap:36px;padding-top:150px}.ft-bar img{width:150px}.ft-bar{height:72px}
 
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- WordPress additions ---------- */
.label a{color:inherit;text-decoration:none}
.label a:hover{text-decoration:underline;text-underline-offset:5px}
.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}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;margin:0;left:12px;top:12px;z-index:100000;background:#fff;color:var(--navy);padding:12px 18px;border-radius:8px}
.links ul{list-style:none;margin:0;padding:0;display:flex;align-items:flex-start;gap:53px}
.links li{margin:0}
.search-panel{display:none;position:absolute;right:0;top:56px;z-index:40;width:min(480px,100%)}
.hd.search-open .search-panel{display:block}
.search-form{display:flex;gap:8px;background:#fff;padding:8px;border-radius:14px;box-shadow:0 12px 32px rgba(20,40,90,.22)}
.search-field{flex:1;min-width:0;font:inherit;font-size:17px;padding:12px 14px;border:2px solid #dfe5ef;border-radius:10px;color:var(--navy)}
.search-submit{font:inherit;font-weight:600;background:var(--navy);color:#fff;border:0;border-radius:10px;padding:0 20px;cursor:pointer}
.search-submit:hover{background:#17306a}
.pager{flex-wrap:wrap}
.pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:50px;min-width:46px;padding:0;border-radius:9px;background:var(--sky);color:#fff;font-size:18px;font-weight:500;transition:background .15s}
.pager a.page-numbers:hover{background:#2f7fae}
.pager .page-numbers.current{background:var(--navy)}
.pager .prev,.pager .next{background:var(--navy);padding:0 22px;font-weight:600}
.pager a.prev:hover,.pager a.next:hover{background:#17306a}
.pager .prev{margin-right:12px}.pager .next{margin-left:12px}
.pager .dots{background:transparent;min-width:0}
.empty{font-size:20px;line-height:1.6;margin:0}
.single .panel,.page .panel,.error404 .panel{padding-bottom:345px}
.hero{aspect-ratio:1019/584;border:2px solid #fff;border-radius:12px;overflow:hidden;background:#fff}
.hero img{display:block;width:100%;height:100%;object-fit:cover}
.post-title{margin:24px 0 14px;font-family:inherit;text-transform:none;font-size:40px;line-height:1.15;font-weight:600;letter-spacing:-.01em}
.hero+.post-title{margin-top:24px}.label+.post-title{margin-top:0}
.meta{display:inline-block;background:var(--orange);color:#fff;font-size:14px;font-weight:500;line-height:1;padding:7px 14px;border-radius:7px;margin:0 0 34px 3px;text-transform:uppercase}
.meta i{font-style:normal;margin:0 9px}
.post-body{padding-left:2px;font-size:20px;line-height:1.625}
.post-body>*{margin:0 0 40px}
.post-body>*:last-child{margin-bottom:0}
.post-body h2,.post-body h3,.post-body h4{line-height:1.2;font-weight:600}
.post-body h2{font-size:32px}.post-body h3{font-size:28px}.post-body h4{font-size:22px}
.post-body a{text-decoration:underline;text-underline-offset:3px;transition:opacity .15s}
.post-body a:hover{opacity:.75}
.post-body ul,.post-body ol{padding-left:1.4em}
.post-body blockquote{padding-left:20px;border-left:4px solid var(--orange)}
.post-body figure{max-width:100%}
.post-body img{max-width:100%;height:auto;border-radius:12px}
.post-body figcaption,.wp-caption-text{font-size:15px;opacity:.85;margin-top:8px}
.post-body pre,.post-body code{background:rgba(0,0,0,.2);border-radius:8px;font-size:16px}
.post-body pre{padding:16px;overflow-x:auto}
.post-body iframe,.post-body video{max-width:100%}
.alignleft{float:left;margin:0 24px 16px 0}.alignright{float:right;margin:0 0 16px 24px}.aligncenter{display:block;margin-inline:auto}
@media (max-width:820px){.links ul{flex-direction:column;gap:2px}.single .panel,.page .panel,.error404 .panel{padding-bottom:240px}.post-title{font-size:32px}.post-body{font-size:18px}.post-body>*{margin-bottom:28px}.post-body h2{font-size:26px}.post-body h3{font-size:24px}}
@media (max-width:560px){.post-title{font-size:26px}.meta{font-size:12px;padding:7px 10px}.search-submit{padding:0 14px}}