/*
Theme Name: Setúbal do Sado
Theme URI: https://setubaldosado.pt
Author: Setúbal do Sado
Description: Tema de notícias e comunidade para o portal Setúbal do Sado. Azul oceano, destaque de notícias, agenda, ligação ao grupo de Facebook, áreas de widgets para blocos HTML e opções no Personalizar.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: setubaldosado
*/

:root{
  --azul:#0a6fc2; --marinho:#06264a; --sol:#ffb703; --ciano:#19b5e6;
  --papel:#f4f8fc; --tinta:#10243b; --suave:#5b6f86; --linha:#dbe5ef;
  --max:1200px;
  --f-tit:"Bricolage Grotesque","Trebuchet MS",system-ui,sans-serif;
  --f-txt:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--f-txt);font-size:17px;line-height:1.65;color:var(--tinta);background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:var(--azul);text-underline-offset:.15em}
a:hover{color:var(--marinho)}
:focus-visible{outline:3px solid var(--sol);outline-offset:2px}
h1,h2,h3,h4{font-family:var(--f-tit);line-height:1.15;color:var(--marinho);margin:0 0 .5em;letter-spacing:-.01em;font-weight:800}
.container{width:min(100% - 2rem,var(--max));margin-inline:auto}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
.skip{position:absolute;left:-999px;top:0;background:var(--sol);color:#000;padding:.6rem 1rem;z-index:200}
.skip:focus{left:0}

/* Barra de topo */
.topbar{background:var(--marinho);color:#cfe3f7;font-size:.875rem}
.topbar-in{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.45rem 0}
.topbar p{margin:0;font-style:italic}
.topbar a{color:#fff;text-decoration:none;font-weight:600}
.topbar a:hover{color:var(--sol)}

/* Cabeçalho */
.site-header{background:#fff;border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:50}
.header-in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:72px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--marinho)}
.brand svg{width:40px;height:40px;flex:none}
.brand-name{font-family:var(--f-tit);font-weight:800;font-size:1.55rem;letter-spacing:-.02em;line-height:1;font-style:italic}
.brand-name b{color:var(--azul);font-weight:800}
.custom-logo{max-height:56px;width:auto}
.nav-wrap{display:flex;align-items:center;gap:.75rem}
.primary-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.2rem;align-items:center}
.primary-nav li{position:relative}
.primary-nav a{display:block;padding:.55rem .8rem;border-radius:8px;color:var(--tinta);text-decoration:none;font-weight:600;font-size:.97rem}
.primary-nav a:hover,.primary-nav .current-menu-item>a,.primary-nav .current-cat>a{background:color-mix(in srgb,var(--azul) 10%,#fff);color:var(--azul)}
.primary-nav .sub-menu{display:none;position:absolute;top:100%;left:0;min-width:210px;flex-direction:column;align-items:stretch;background:#fff;border:1px solid var(--linha);border-radius:10px;padding:.35rem;gap:0;z-index:60}
.primary-nav li:hover>.sub-menu,.primary-nav li:focus-within>.sub-menu{display:flex}
.menu-toggle{display:none;background:var(--azul);color:#fff;border:0;border-radius:8px;padding:.55rem .95rem;font:700 .95rem var(--f-txt);cursor:pointer}
.search-form{display:flex;border:1px solid var(--linha);border-radius:999px;overflow:hidden;background:#fff}
.search-form input[type=search]{border:0;padding:.5rem .9rem;font:inherit;font-size:.92rem;min-width:0;width:150px;background:transparent;color:var(--tinta)}
.search-form input:focus{outline:none}
.search-form:focus-within{border-color:var(--azul)}
.search-form button{border:0;background:var(--azul);color:#fff;padding:0 1rem;cursor:pointer;font:700 .88rem var(--f-txt)}

/* Botões e etiquetas */
.btn{display:inline-block;background:var(--sol);color:#2a1d00;font-weight:800;padding:.8rem 1.4rem;border-radius:999px;text-decoration:none;font-family:var(--f-tit);border:0;cursor:pointer}
.btn:hover{filter:brightness(1.07);color:#2a1d00}
.chip{display:inline-block;position:relative;z-index:4;background:var(--sol);color:#2a1d00;font-weight:700;font-size:.78rem;padding:.15rem .55rem;border-radius:6px;text-decoration:none;line-height:1.5}
.chip--azul{background:color-mix(in srgb,var(--azul) 12%,#fff);color:var(--azul)}
.meta{font-size:.84rem;color:var(--suave);margin:0;display:flex;flex-wrap:wrap;gap:.2rem .9rem}

/* Destaques */
.hero{position:relative;color:#fff;padding:2rem 0 5.5rem;overflow:hidden;
  background:radial-gradient(1100px 480px at 88% -10%,color-mix(in srgb,var(--ciano) 55%,transparent),transparent 62%),linear-gradient(180deg,var(--marinho),color-mix(in srgb,var(--azul) 65%,var(--marinho)))}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:64px;pointer-events:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'><path fill='%23ffffff' d='M0 32C90 8 270 8 360 32S630 56 720 32C810 8 990 8 1080 32S1350 56 1440 32V64H0Z'/></svg>") repeat-x;
  background-size:1440px 64px;animation:onda 45s linear infinite}
@keyframes onda{to{background-position-x:-1440px}}
.hero-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:1.25rem;position:relative;z-index:2}
.hero-main{position:relative;border-radius:18px;overflow:hidden;min-height:440px;display:flex;align-items:flex-end;background:#0b3a6b}
.hero-main>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-main::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(3,18,38,.9))}
.hero-main-body{position:relative;z-index:2;padding:1.75rem}
.hero-main h2{font-size:clamp(1.6rem,3.2vw,2.5rem);color:#fff;margin:.6rem 0 .5rem}
.hero-main h2 a{color:inherit;text-decoration:none}
.hero-main h2 a::after{content:"";position:absolute;inset:0;z-index:3}
.hero .meta{color:#cfe3f7}
.hero-side{display:grid;gap:.75rem;align-content:start}
.side-item{display:grid;grid-template-columns:112px 1fr;gap:.9rem;padding:.75rem;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);position:relative}
.side-item:hover{background:rgba(255,255,255,.15)}
.side-item img,.side-item .ph{width:112px;height:92px;object-fit:cover;border-radius:8px;background:rgba(255,255,255,.12)}
.side-item h3{font-size:1.05rem;color:#fff;margin:.3rem 0 .2rem}
.side-item h3 a{color:inherit;text-decoration:none}
.side-item h3 a::after{content:"";position:absolute;inset:0;z-index:3}
.hero-empty{grid-column:1/-1;padding:3rem 1rem;text-align:center}
.hero-empty h2{color:#fff;font-size:2rem}

/* Secções */
.section{padding:2.25rem 0}
.section--alt{background:var(--papel)}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.25rem;border-bottom:2px solid var(--linha);padding-bottom:.6rem;position:relative}
.section-head::after{content:"";position:absolute;left:0;bottom:-2px;width:72px;height:2px;background:var(--azul)}
.section-head h2{margin:0;font-size:1.6rem}
.more{font-weight:700;text-decoration:none;font-size:.92rem}
.grid{display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr)}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
.card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--linha);border-radius:10px;overflow:hidden;transition:border-color .2s}
.card:hover{border-color:var(--azul)}
.card-img{aspect-ratio:16/10;background:linear-gradient(135deg,var(--azul),var(--ciano));overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-body{padding:1rem 1.1rem 1.15rem;display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;flex:1}
.card h3{font-size:1.15rem;margin:.15rem 0 0}
.card h3 a{color:var(--marinho);text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0;z-index:3}
.card p{margin:0;color:var(--suave);font-size:.95rem}
.card .meta{margin-top:auto;padding-top:.5rem}

/* Convite para o grupo */
.fb-band{border-radius:18px;background:linear-gradient(120deg,var(--azul),var(--marinho));color:#fff;padding:2rem;display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem;align-items:center;margin:2rem 0}
.fb-band h2{color:#fff;margin:0 0 .25rem;font-size:clamp(1.35rem,2.6vw,2rem)}
.fb-band p{margin:0;color:#d6e8fa}
.fb-band-ico,.join-ico{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.16);display:grid;place-items:center}
.fb-band-ico svg,.join-ico svg{width:34px;height:34px;fill:#fff}
.widget_sds_join{background:linear-gradient(160deg,var(--azul),var(--marinho));color:#fff;border:0!important}
.widget_sds_join .widget-title{color:#fff}
.widget_sds_join p{color:#d6e8fa;margin:0 0 1rem}
.widget_sds_join .join-ico{margin-bottom:.8rem}

/* Páginas e artigos */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:2.5rem;padding:2rem 0 3rem}
.layout--solo{grid-template-columns:minmax(0,1fr)}
.entry-header h1{font-size:clamp(1.9rem,4vw,2.9rem);margin:.5rem 0 .75rem}
.entry-meta{margin-bottom:1rem}
.entry-thumb{margin:1rem 0 1.25rem;border-radius:14px;overflow:hidden}
.entry-thumb figcaption{font-size:.85rem;color:var(--suave);padding:.5rem 0}
.entry-content{font-size:1.08rem;max-width:780px}
.entry-content>*{max-width:100%}
.entry-content h2{font-size:1.7rem;margin-top:2rem}
.entry-content h3{font-size:1.35rem;margin-top:1.6rem}
.entry-content p,.entry-content ul,.entry-content ol{margin:0 0 1.2em}
.entry-content blockquote{margin:1.5rem 0;padding:.4rem 0 .4rem 1.25rem;border-left:5px solid var(--azul);font-size:1.15rem;color:var(--marinho)}
.entry-content figure{margin:1.5rem 0}
.entry-content figcaption{font-size:.85rem;color:var(--suave)}
.entry-content iframe,.entry-content video{max-width:100%}
.entry-content table{border-collapse:collapse;width:100%;font-size:.95rem;display:block;overflow-x:auto}
.entry-content th,.entry-content td{border:1px solid var(--linha);padding:.55rem .7rem;text-align:left}
.entry-content th{background:var(--papel)}
.entry-content pre{background:var(--marinho);color:#e6f1fb;padding:1rem;border-radius:10px;overflow:auto}
.entry-content .alignleft{float:left;margin:.3rem 1.25rem 1rem 0}
.entry-content .alignright{float:right;margin:.3rem 0 1rem 1.25rem}
.entry-content .aligncenter{margin-inline:auto}
.wp-caption{max-width:100%}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.5rem 0}
.tags a{font-size:.85rem;text-decoration:none;border:1px solid var(--linha);border-radius:999px;padding:.15rem .75rem;color:var(--suave)}
.share{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:1.1rem 0;font-size:.9rem;color:var(--suave)}
.share a,.share button{font:600 .88rem var(--f-txt);text-decoration:none;color:var(--marinho);border:1px solid var(--linha);background:#fff;border-radius:999px;padding:.35rem .9rem;cursor:pointer}
.share a:hover,.share button:hover{border-color:var(--azul);color:var(--azul)}
.related{margin-top:2.5rem}
.page-head{padding:2.25rem 0 1.5rem;background:var(--papel);border-bottom:1px solid var(--linha)}
.page-head h1{margin:0;font-size:clamp(1.8rem,4vw,2.6rem)}
.archive-desc{color:var(--suave);margin-top:.5rem;max-width:700px}
.canvas{padding:0}
.canvas .entry-content{max-width:none;font-size:inherit}
.wide-page{padding:2rem 0 3rem}
.wide-page .entry-content{max-width:none}
.not-found{text-align:center;padding:4rem 0}
.not-found h1{font-size:clamp(3rem,10vw,6rem);color:var(--azul)}

/* Barra lateral, anúncios e widgets */
.widget{margin-bottom:1.75rem;padding:1.25rem;border:1px solid var(--linha);border-radius:12px}
.widget-title{font-size:1.1rem;margin-bottom:.75rem}
.widget ul{margin:0;padding-left:1.1rem}
.widget li{margin-bottom:.4rem}
.ad-slot{margin:1.25rem auto;text-align:center;overflow:hidden;max-width:100%}
.ad-wrap .widget{border:0;padding:0}
.home-widgets .widget{border:0;padding:0}
.home-widgets{padding:1rem 0}

/* Modelos para blocos HTML */
.evento{display:grid;grid-template-columns:96px 1fr;gap:1rem;border:1px solid var(--linha);border-radius:12px;padding:1rem;align-items:center;margin:1rem 0}
.evento-data{background:var(--azul);color:#fff;border-radius:10px;text-align:center;padding:.7rem .4rem;font-family:var(--f-tit);line-height:1.1}
.evento-data strong{display:block;font-size:2rem}
.evento h3{margin:0 0 .25rem}
.evento p{margin:0;color:var(--suave)}
.caixa-info{border-left:5px solid var(--sol);background:#fff8e1;padding:1rem 1.25rem;border-radius:0 10px 10px 0;margin:1.25rem 0}

/* Paginação e comentários */
.pagination{display:flex;gap:.4rem;justify-content:center;margin-top:2rem;flex-wrap:wrap}
.page-numbers{padding:.5rem .9rem;border:1px solid var(--linha);border-radius:8px;text-decoration:none;font-weight:600}
.page-numbers.current{background:var(--azul);color:#fff;border-color:var(--azul)}
.comments{margin-top:2.5rem}
.comment-list{list-style:none;padding:0}
.comment-list .children{list-style:none;padding-left:1.5rem}
.comment-body{border:1px solid var(--linha);border-radius:10px;padding:1rem;margin-bottom:.8rem}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;border:1px solid var(--linha);border-radius:8px;padding:.6rem .8rem;font:inherit}
.comment-form .submit{background:var(--azul);color:#fff;border:0;border-radius:999px;padding:.7rem 1.4rem;font:700 1rem var(--f-txt);cursor:pointer}

/* Rodapé */
.site-footer{background:var(--marinho);color:#b9d0e8;margin-top:3rem}
.site-footer a{color:#fff}
.footer-widgets{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;padding:3rem 0 2rem}
.site-footer .widget{border:0;padding:0}
.site-footer .widget-title,.site-footer h3{color:#fff}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.4rem}
.footer-bottom{border-top:1px solid rgba(255,255,255,.14);padding:1.1rem 0;font-size:.875rem}
.footer-bottom .container{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.social{display:flex;gap:1rem;flex-wrap:wrap}

/* Responsivo */
@media(max-width:1000px){
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .layout{grid-template-columns:1fr}
  .hero-grid{grid-template-columns:1fr}
  .hero-main{min-height:360px}
  .fb-band{grid-template-columns:1fr;text-align:center}
  .fb-band-ico{margin-inline:auto}
}
@media(max-width:900px){
  .menu-toggle{display:inline-flex}
  .nav-wrap{position:static}
  .primary-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--linha);padding:1rem}
  .primary-nav.is-open{display:block}
  .primary-nav ul{flex-direction:column;align-items:stretch}
  .primary-nav .sub-menu{display:flex;position:static;border:0;padding:0 0 0 1rem}
  .primary-nav .search-form{margin-top:.75rem}
  .search-form input[type=search]{width:100%;flex:1}
}
@media(max-width:700px){
  body{font-size:16px}
  .grid,.grid--2,.grid--4{grid-template-columns:1fr}
  .footer-widgets{grid-template-columns:1fr}
  .topbar-slogan{display:none}
  .topbar-in{justify-content:center}
  .side-item{grid-template-columns:92px 1fr}
  .side-item img,.side-item .ph{width:92px;height:80px}
  .evento{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}