/*
Theme Name: Paraense Project Ragnarok
Theme URI: https://example.com/paraense-project-ragnarok
Author: OpenAI
Author URI: https://openai.com/
Description: Tema WordPress para portfolio com estetica de MMORPG classico inspirado no clima de Ragnarok Online, sem uso de assets oficiais.
Version: 1.0.0
Requires at least: 6.0
Text Domain: paraense-project-ragnarok
Tags: blog, portfolio, dark, featured-images, custom-menu, custom-logo
*/

:root {
  --bg: #0f1727;
  --bg2: #18263f;
  --panel: #223556;
  --panel-dark: #17263f;
  --gold: #d8b14a;
  --gold-2: #f0d98b;
  --text: #f5ebcf;
  --muted: #d4c8a6;
  --line: #8f6d28;
  --shadow: 0 8px 24px rgba(0,0,0,.35);
  --radius: 14px;
  --max-width: 1140px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font-family:Verdana,Arial,sans-serif;
  background:
    linear-gradient(rgba(8,12,22,.82), rgba(8,12,22,.94)),
    radial-gradient(circle at top, rgba(71,108,166,.25), transparent 35%),
    linear-gradient(180deg, #101827 0%, #0c1320 100%);
  min-height:100vh;
}
img{max-width:100%;height:auto}
a{color:var(--gold-2);text-decoration:none}
a:hover,a:focus{filter:brightness(1.08)}
.site-wrapper{min-height:100vh;display:flex;flex-direction:column}
.site-top{
  border-bottom:3px solid var(--gold);
  background:linear-gradient(180deg, #2c436d 0%, #1b2b47 55%, #152238 100%);
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.site-top::before,.site-top::after{
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.08), transparent 70%);
  pointer-events:none;
}
.site-top::before{top:-80px;left:-60px}
.site-top::after{top:-90px;right:-60px}
.header-wrap,.nav-inner,.site-content,.footer-inner{width:min(var(--max-width),calc(100% - 32px));margin:0 auto}
.header-wrap{padding:34px 0 26px;text-align:center;position:relative;z-index:2}
.site-branding{display:inline-flex;flex-direction:column;align-items:center;gap:8px}
.custom-logo-link img{max-height:80px;width:auto}
.site-title{
  margin:0;
  font-size:clamp(2rem,5vw,2.8rem);
  line-height:1.1;
  color:var(--gold-2);
  letter-spacing:2px;
  text-shadow:0 2px 0 #000,0 0 14px rgba(216,177,74,.24);
}
.site-title a{color:inherit}
.site-description{margin:0;max-width:760px;color:var(--muted);font-size:.95rem;line-height:1.7}
.nav-bar{
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:2px solid var(--gold);
  background:rgba(7,12,21,.82);
  backdrop-filter:blur(4px);
}
.nav-inner{padding:12px 0}
.primary-navigation ul{list-style:none;margin:0;padding:0;display:flex;justify-content:center;flex-wrap:wrap;gap:12px}
.primary-navigation a{
  display:inline-block;
  padding:10px 16px;
  border:1px solid rgba(216,177,74,.45);
  border-radius:999px;
  background:linear-gradient(180deg, rgba(47,70,109,.8), rgba(22,36,60,.86));
  color:var(--gold-2);
  font-size:.82rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.site-content{flex:1;padding:28px 0 40px}
.layout-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px}
.layout-grid.single-column{grid-template-columns:minmax(0,1fr)}
.content-area,.sidebar-area{min-width:0}
.hero-box,.post-card,.archive-header,.page-card,.sidebar-box,.pagination-box,.quest-nav,.comment-box{
  position:relative;
  border:2px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(34,53,86,.96), rgba(22,38,63,.98));
  box-shadow:var(--shadow);
}
.hero-box,.archive-header,.page-card,.post-card,.pagination-box,.quest-nav,.comment-box{padding:24px}
.hero-box::before,.archive-header::before,.page-card::before,.post-card::before,.sidebar-box::before,.comment-box::before{
  position:absolute;
  top:-12px;
  left:18px;
  background:linear-gradient(180deg,#f0d98b,#c9972d);
  color:#2b1f0c;
  font-size:11px;
  font-weight:700;
  padding:5px 12px;
  border-radius:999px;
  letter-spacing:1px;
}
.hero-box{margin-bottom:22px;border-color:var(--gold)}
.hero-box::before{content:"GUILD NOTICE"}
.hero-box h2,.archive-title,.page-title,.entry-title{margin:10px 0;color:var(--gold-2);text-shadow:0 1px 0 #000}
.hero-box h2{font-size:clamp(1.5rem,3vw,2rem)}
.hero-box p,.archive-description,.page-content,.entry-content,.sidebar-box,.entry-summary{line-height:1.8}
.post-card{margin-bottom:22px}
.post-card::before{content:"QUEST COMPLETA"}
.archive-header{margin-bottom:22px}
.archive-header::before{content:"QUEST LOG"}
.page-card{margin-bottom:22px}
.page-card::before{content:"ADVENTURER NOTE"}
.sidebar-box{margin-bottom:22px;padding:20px}
.sidebar-box::before{content:"STATUS"}
.entry-title,.page-title{font-size:clamp(1.5rem,4vw,2rem);line-height:1.25}
.entry-title a{color:inherit}
.entry-meta,.archive-meta,.project-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px;font-size:.75rem;color:var(--muted)}
.meta-badge{display:inline-block;padding:6px 10px;border:1px solid rgba(216,177,74,.35);border-radius:999px;background:rgba(12,19,31,.45)}
.entry-thumbnail,.page-thumbnail{margin-bottom:16px}
.entry-thumbnail img,.page-thumbnail img{width:100%;border-radius:10px;border:1px solid rgba(240,217,139,.25)}
.entry-summary,.entry-content,.page-content{font-size:.97rem;color:var(--text)}
.entry-content h2,.entry-content h3,.entry-content h4,.page-content h2,.page-content h3,.page-content h4{color:var(--gold-2)}
.entry-content ul,.entry-content ol,.page-content ul,.page-content ol{padding-left:22px}
.entry-content blockquote,.page-content blockquote{margin:18px 0;padding:14px 16px;border-left:3px solid var(--gold);background:rgba(255,255,255,.04);border-radius:0 12px 12px 0}
.read-more,.button-link,.wp-block-button__link,button,input[type="submit"]{
  display:inline-block;
  margin-top:16px;
  padding:11px 16px;
  border-radius:10px;
  border:0;
  font-weight:700;
  color:#2b1f0c;
  background:linear-gradient(180deg,#f0d98b,#c9972d);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
  cursor:pointer;
}
.pagination-box{text-align:center}
.pagination-box .nav-links{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
.pagination-box .page-numbers,.quest-nav a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  padding:10px 14px;
  border-radius:10px;
  border:1px solid rgba(216,177,74,.4);
  background:linear-gradient(180deg, rgba(47,70,109,.8), rgba(22,36,60,.86));
  color:var(--gold-2);
  font-weight:700;
}
.pagination-box .current{background:linear-gradient(180deg,#f0d98b,#c9972d);color:#2b1f0c}
.quest-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
.quest-nav .nav-label{display:block;font-size:.78rem;color:var(--muted);margin-bottom:8px}
.quest-nav .nav-title{display:block;color:var(--gold-2);font-weight:700}
.sidebar-title,.widget-title{margin:0 0 12px;color:var(--gold-2);font-size:1.1rem;text-transform:uppercase;letter-spacing:.8px}
.sidebar-box ul,.widget ul{margin:0;padding-left:18px}
.widget{margin:0}
.widget + .widget{margin-top:22px}
.sidebar-box p,.sidebar-box li,.widget,.widget p,.widget li{color:var(--text);line-height:1.7;font-size:.92rem}
.search-form{display:grid;grid-template-columns:1fr auto;gap:8px}
input[type="search"],input[type="text"],input[type="email"],input[type="url"],textarea{
  width:100%;
  padding:12px 14px;
  border-radius:10px;
  border:1px solid rgba(216,177,74,.35);
  background:rgba(8,12,21,.75);
  color:var(--text);
}
textarea{min-height:160px}
.site-footer{border-top:2px solid var(--gold);background:rgba(8,12,21,.95)}
.footer-inner{padding:22px 0 32px;text-align:center;color:var(--muted);font-size:.88rem;line-height:1.7}
.footer-inner p{margin:0}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.aligncenter{display:block;margin-left:auto;margin-right:auto}
.alignleft{float:left;margin-right:18px;margin-bottom:10px}
.alignright{float:right;margin-left:18px;margin-bottom:10px}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:.85rem;color:var(--muted)}
.comment-list,.comment-list ol{list-style:none;padding-left:0}
.comment-body{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
@media (max-width:940px){.layout-grid{grid-template-columns:1fr}}
@media (max-width:640px){
  .header-wrap,.nav-inner,.site-content,.footer-inner{width:min(var(--max-width),calc(100% - 22px))}
  .quest-nav{grid-template-columns:1fr}
  .primary-navigation a{padding:9px 14px;font-size:.76rem}
  .hero-box,.archive-header,.page-card,.post-card,.pagination-box,.quest-nav,.comment-box,.sidebar-box{padding:18px}
}
