/* /praias-fluviais e /en/river-beaches-portugal — Portal Turismo Portugal — 2026-10-11
 * Carrega depois de css/praia-v2.css (reutiliza .pv2-crumbs, .pv2-kicker, .pv2-chips, .pv2-btn, .pv2-note).
 * Tema proprio: verde de rio (em vez do navy das praias de mar), mapa em relevo com os pontos das fluviais,
 * barra da qualidade da agua, grafico das epocas balneares e lista filtravel.
 * ATENCAO style.css ate 768px: nenhuma classe contem "-grid" nem "-card"; main.pv2 anula o padding com !important.
 */
.fl-page{background:#071d1a;}
main.pv2.fl{
  --ink:#071d1a; --ink2:#0a2622; --ink3:#103a33; --teal:#5fd0bf; --teal-d:#2f9e8f; --line:rgba(255,255,255,.09);
  --q-ex:#4fd1b5; --q-gd:#a3d977; --q-sf:#f4c152; --q-pr:#f2785c; --q-nr:#9aa7a4;
  background:var(--ink);
}
.fl .q-ex{--c:var(--q-ex);} .fl .q-gd{--c:var(--q-gd);} .fl .q-sf{--c:var(--q-sf);} .fl .q-pr{--c:var(--q-pr);} .fl .q-nr{--c:var(--q-nr);}
.fl h3{font-family:'Inter',system-ui,sans-serif; font-weight:600; color:#fff;}
.fl-vh{position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.fl-intro{margin:0 0 22px; max-width:62ch; color:var(--mut); line-height:1.65;}
.fl-src{margin:12px 0 0; font-size:.78rem; color:rgba(255,255,255,.45); line-height:1.5;}

/* ── Hero: texto + mapa em relevo ─────────────────────────────────────── */
main.pv2.fl > .fl-hero{position:relative; isolation:isolate; padding-top:clamp(96px,13vh,140px) !important; padding-bottom:clamp(36px,6vw,64px) !important;
  background:radial-gradient(70% 90% at 85% 10%,rgba(95,208,191,.16) 0%,rgba(95,208,191,0) 60%),radial-gradient(60% 80% at 0% 100%,rgba(201,168,76,.12) 0%,rgba(201,168,76,0) 60%),linear-gradient(160deg,#071d1a 0%,#0a2622 55%,#0d302a 100%);}
main.pv2.fl > .fl-hero::before{content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cg fill='none' stroke='%235fd0bf' stroke-width='1' opacity='.22'%3E%3Cpath d='M-20 120 C80 60 160 200 260 140 S440 60 620 150'/%3E%3Cpath d='M-20 170 C80 110 160 250 260 190 S440 110 620 200'/%3E%3Cpath d='M-20 220 C80 160 160 300 260 240 S440 160 620 250'/%3E%3C/g%3E%3C/svg%3E") top left/600px 600px repeat-x;}
.fl-hero__in{max-width:1120px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(28px,5vw,72px); align-items:center;}
.fl-hero__text{min-width:0; animation:pv2-rise .7s cubic-bezier(.22,1,.36,1) both;}
.fl-hero h1{margin:0 0 18px; font-family:'Bodoni Moda',Georgia,serif; font-weight:600; color:#fff; font-size:clamp(2.6rem,6vw,4.8rem); line-height:.98; letter-spacing:-.02em;}
.fl-hero h1 em{display:block; font-style:italic; font-weight:400; color:var(--teal);}
.fl-lead{margin:0 0 22px; max-width:48ch; font-size:1.02rem; line-height:1.65; color:rgba(255,255,255,.76);}
.fl .pv2-chip--ok i{background:var(--q-ex);}

.fl-map{position:relative; margin:0; width:300px; aspect-ratio:1250/2560; border-radius:28px; overflow:hidden; background:#0b2a25;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.85), inset 0 0 0 1px rgba(95,208,191,.18);}
.fl-map img{position:absolute; inset:0; width:100%; height:100% !important; object-fit:cover; display:block; filter:saturate(.75) brightness(.8) hue-rotate(-8deg);}
.fl-dots{position:absolute; inset:0; width:100%; height:100%;}
.fl-dots circle{fill:var(--c); stroke:#06201b; stroke-width:5; transition:r .15s ease, opacity .2s ease;}
.fl-dots a:hover circle,.fl-dots a:focus circle{r:30;}
.fl-dots a:focus{outline:none;} .fl-dots a:focus-visible circle{stroke:#fff; stroke-width:8;}
.fl-dots a.is-off circle{opacity:.18;}
.fl-legend{position:absolute; left:10px; right:10px; bottom:10px; display:flex; flex-wrap:wrap; gap:4px 10px; padding:8px 10px; border-radius:14px;
  background:rgba(4,22,19,.78); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); font-size:.68rem; color:rgba(255,255,255,.82);}
.fl-legend span{display:inline-flex; align-items:center; gap:5px;}
.fl-legend i{width:8px; height:8px; border-radius:50%; background:var(--c);}

/* ── Num relance ─────────────────────────────────────────────────────── */
main.pv2.fl > .fl-glance{padding-top:clamp(36px,5vw,64px) !important; padding-bottom:clamp(20px,3vw,40px) !important;}
.fl-stats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:0 0 22px;}
.fl-stats > div{padding:20px 18px; border-radius:20px; background:linear-gradient(160deg,rgba(95,208,191,.10),rgba(95,208,191,.02)); border:1px solid var(--line);}
.fl-stats b{display:block; font-family:'Bodoni Moda',Georgia,serif; font-size:clamp(2rem,4vw,2.8rem); line-height:1; color:#fff; margin:0 0 8px;}
.fl-stats span{display:block; font-size:.86rem; line-height:1.45; color:var(--mut);}
.fl-q{padding:22px; border-radius:20px; border:1px solid var(--line); background:rgba(255,255,255,.025);}
.fl-q h3{display:flex; align-items:center; gap:10px; margin:0 0 14px; font-size:1rem;}
.fl-q h3 svg,.fl-notes svg{width:20px; height:20px; stroke:var(--teal); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none;}
.fl-q__bar{display:flex; height:14px; border-radius:999px; overflow:hidden; gap:2px;}
.fl-q__bar span{background:var(--c); min-width:4px;}
.fl-q__leg{display:flex; flex-wrap:wrap; gap:8px 18px; list-style:none; margin:14px 0 0; padding:0; font-size:.88rem; color:var(--mut);}
.fl-q__leg li{display:inline-flex; align-items:center; gap:7px;}
.fl-q__leg i{width:10px; height:10px; border-radius:3px; background:var(--c);}
.fl-q__leg b{color:#fff;}

/* ── Epoca balnear ───────────────────────────────────────────────────── */
main.pv2.fl > .fl-season{padding-top:clamp(28px,4vw,48px) !important; padding-bottom:clamp(20px,3vw,40px) !important;}
.fl-sz{padding:22px 22px 16px; border-radius:20px; border:1px solid var(--line); background:rgba(255,255,255,.025);}
.fl-sz__ax{position:relative; height:18px; margin:0 44px 8px 210px; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.45);}
.fl-sz__ax span{position:absolute; top:0; transform:translateX(-50%);}
.fl-sz ul{list-style:none; margin:0; padding:0;}
.fl-sz li{display:grid; grid-template-columns:200px minmax(0,1fr) 34px; gap:10px; align-items:center; padding:7px 0; border-top:1px solid var(--line);}
.fl-sz__l{font-size:.86rem; color:rgba(255,255,255,.85);}
.fl-sz__t{position:relative; height:12px; border-radius:999px; background:rgba(255,255,255,.05);
  background-image:linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:20% 100%;}
.fl-sz__b{position:absolute; top:0; bottom:0; border-radius:999px; background:linear-gradient(90deg,var(--teal-d),var(--teal));}
.fl-sz li b{text-align:right; color:#fff; font-size:.95rem;}
.fl-sz__o{margin:12px 0 0; font-size:.78rem; color:rgba(255,255,255,.45);}

/* ── Lista filtravel ─────────────────────────────────────────────────── */
main.pv2.fl > .fl-browse{padding-top:clamp(36px,5vw,64px) !important;}
.fl-ctl{display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:0 0 10px; padding:14px; border-radius:20px; background:rgba(255,255,255,.035); border:1px solid var(--line);}
.fl-search{display:flex; align-items:center; gap:8px; flex:1 1 240px; min-width:0; padding:0 14px; height:46px; border-radius:999px; background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.14);}
.fl-search svg{width:18px; height:18px; stroke:rgba(255,255,255,.55); fill:none; stroke-width:2; flex:none;}
.fl-search input{flex:1; min-width:0; height:100%; border:0; background:transparent; color:#fff; font:inherit; font-size:.95rem; outline:none;}
.fl-search input::placeholder{color:rgba(255,255,255,.4);}
.fl-search:focus-within{border-color:var(--teal);}
.fl-seg,.fl-tg{display:flex; flex-wrap:wrap; gap:6px;}
.fl-seg button,.fl-tg button,#fl-reset{display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:8px 14px; border-radius:999px; border:1px solid rgba(255,255,255,.16); background:transparent; color:rgba(255,255,255,.82); font:inherit; font-size:.85rem; cursor:pointer; transition:background .15s, border-color .15s, color .15s;}
.fl-seg button b{font-weight:600; color:rgba(255,255,255,.5); font-size:.78rem;}
.fl-seg button[aria-pressed="true"],.fl-tg button[aria-pressed="true"]{background:var(--teal); border-color:var(--teal); color:#062520;}
.fl-seg button[aria-pressed="true"] b{color:rgba(6,37,32,.7);}
.fl-tg i{width:9px; height:9px; border-radius:50%; background:var(--c);}
.fl-tg svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.fl-seg button:focus-visible,.fl-tg button:focus-visible,#fl-reset:focus-visible{outline:2px solid var(--gold-l); outline-offset:2px;}
.fl-cnt{flex-basis:100%; margin:2px 4px 0; font-size:.82rem; color:var(--mut);} .fl-cnt b{color:#fff;}
.fl-none{margin:22px 0; color:var(--mut);}
.fl-reg{margin:30px 0 0;}
.fl-reg[hidden]{display:none;}
.fl-reg__h{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:0 0 14px; padding:0 0 10px; border-bottom:1px solid rgba(95,208,191,.25);}
.fl-reg__h h3{margin:0; font-family:'Bodoni Moda',Georgia,serif; font-size:1.6rem; font-weight:600;}
.fl-reg__n{font-family:'Inter',system-ui,sans-serif; font-size:.85rem; font-weight:600; color:var(--teal); vertical-align:middle; margin-left:6px;}
.fl-reg__h a{display:inline-flex; align-items:center; gap:6px; font-size:.82rem; color:var(--mut); text-decoration:none; white-space:nowrap;}
.fl-reg__h a:hover{color:#fff;}
.fl-reg__h a svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2;}
.fl-list{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; list-style:none; margin:0; padding:0;}
.fl-item{display:flex; flex-direction:column; min-width:0; border-radius:18px; overflow:hidden; background:var(--ink2); border:1px solid var(--line); scroll-margin-top:90px; transition:border-color .2s, transform .2s;}
.fl-item[hidden]{display:none;}
.fl-item:hover{border-color:rgba(95,208,191,.4); transform:translateY(-2px);}
.fl-item.is-hl{border-color:var(--teal); box-shadow:0 0 0 2px rgba(95,208,191,.35);}
.fl-item__ph{position:relative; margin:0; aspect-ratio:3/2; background:#0d302a; overflow:hidden;}
.fl-item__ph img{display:block; width:100%; height:100% !important; object-fit:cover;}
.fl-item__ph--none{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:rgba(95,208,191,.55);
  background:radial-gradient(80% 80% at 30% 20%,rgba(95,208,191,.14),rgba(95,208,191,0)),repeating-linear-gradient(170deg,rgba(95,208,191,.06) 0 2px,transparent 2px 16px),#0b2a25;}
.fl-item__ph--none svg{width:40px; height:40px; stroke:currentColor; fill:none; stroke-width:1.4; stroke-linecap:round;}
.fl-item__ph--none span{font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;}
.fl-credit{position:absolute; right:8px; bottom:6px; max-width:calc(100% - 16px); margin:0; font-size:9px; line-height:1.2; color:#fff; opacity:.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.fl-item__b{display:flex; flex-direction:column; gap:8px; padding:14px 16px 16px; flex:1;}
.fl-item h4{margin:0; font-family:'Inter',system-ui,sans-serif; font-size:1rem; font-weight:600; line-height:1.3;}
.fl-item h4 a{text-decoration:none; color:#fff;} .fl-item h4 a:hover{color:var(--teal);}
.fl-item h4 a::after{content:''; position:absolute; inset:0;}
.fl-item{position:relative;}
.fl-item__w{display:flex; align-items:center; gap:5px; margin:0; font-size:.8rem; color:var(--mut);}
.fl-item__w svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2; flex:none;}
.fl-pills{display:flex; flex-wrap:wrap; gap:6px;}
.fl-pill{position:relative; z-index:1; display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:.72rem; font-weight:500; color:#fff; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); text-decoration:none;}
.fl-pill i{width:7px; height:7px; border-radius:50%; background:var(--c);}
.fl-pill svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.fl-pill--ba{border-color:rgba(96,165,250,.5); background:rgba(37,99,235,.2);}
.fl-pill--cam{border-color:rgba(255,77,109,.5);}
.fl-item__d{margin:0; font-size:.84rem; line-height:1.55; color:rgba(255,255,255,.66); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden;}

/* ── Concelhos + onde ficar ──────────────────────────────────────────── */
main.pv2.fl > .fl-top{padding-top:clamp(48px,6vw,80px) !important;}
.fl-cols{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(28px,5vw,64px);}
.fl-topc{list-style:none; margin:0; padding:0; counter-reset:c;}
.fl-topc li{display:grid; grid-template-columns:150px minmax(0,1fr) 28px; gap:12px; align-items:center; padding:7px 0; font-size:.9rem; color:rgba(255,255,255,.85);}
.fl-bar{height:10px; border-radius:999px; background:rgba(255,255,255,.05);}
.fl-bar span{display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--teal-d),var(--teal));}
.fl-topc b{text-align:right; color:#fff;}
.fl-stay__l{display:flex; flex-direction:column; gap:10px;}
.fl-stay__a{display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:16px; text-decoration:none; color:#fff; background:rgba(255,255,255,.04); border:1px solid var(--line); transition:border-color .2s, background .2s;}
.fl-stay__a:hover{border-color:rgba(232,201,122,.55); background:rgba(232,201,122,.06);}
.fl-stay__a svg{width:22px; height:22px; stroke:var(--gold-l); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none;}
.fl-stay__a span{display:flex; flex-direction:column;} .fl-stay__a small{font-size:.78rem; color:var(--mut);}

/* ── Antes de ir ─────────────────────────────────────────────────────── */
main.pv2.fl > .fl-before{padding-top:clamp(48px,6vw,80px) !important;}
.fl-notes{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px;}
.fl-notes > div{padding:22px; border-radius:20px; border:1px solid var(--line); background:rgba(255,255,255,.025);}
.fl-notes h3{margin:10px 0 8px; font-size:1rem;}
.fl-notes p{margin:0; font-size:.9rem; line-height:1.65; color:rgba(255,255,255,.72);}
.fl-notes a{color:var(--teal);}

/* ── FAQ + links ─────────────────────────────────────────────────────── */
main.pv2.fl > .fl-faqs,main.pv2.fl > .fl-rel{padding-top:clamp(48px,6vw,80px) !important;}
.fl-faq{border-top:1px solid var(--line);}
.fl-faq:last-of-type{border-bottom:1px solid var(--line);}
.fl-faq summary{cursor:pointer; list-style:none; padding:18px 36px 18px 0; position:relative; font-weight:600; color:#fff;}
.fl-faq summary::-webkit-details-marker{display:none;}
.fl-faq summary::after{content:'+'; position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:1.3rem; color:var(--teal);}
.fl-faq[open] summary::after{content:'–';}
.fl-faq p{margin:0 0 18px; max-width:70ch; line-height:1.7; color:rgba(255,255,255,.74);}
.fl-links{display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin:0; padding:0;}
.fl-links a{display:inline-block; padding:10px 16px; border-radius:999px; border:1px solid rgba(255,255,255,.16); text-decoration:none; font-size:.88rem;}
.fl-links a:hover{border-color:var(--teal); color:var(--teal);}
main.pv2.fl > .pv2-note{max-width:1120px; margin:clamp(40px,5vw,64px) auto 0;}

/* ── Responsivo ──────────────────────────────────────────────────────── */
@media (max-width:1000px){
  .fl-list{grid-template-columns:repeat(2,minmax(0,1fr));}
  .fl-stats{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:900px){
  .fl-hero__in{grid-template-columns:minmax(0,1fr);}
  .fl-map{width:min(260px,70vw); margin:4px auto 0;}
  .fl-cols{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:640px){
  .fl-list{grid-template-columns:minmax(0,1fr); gap:10px;}
  .fl-item{flex-direction:row; border-radius:14px;}
  .fl-item:hover{transform:none;}
  .fl-item__ph{flex:none; width:104px; aspect-ratio:auto; min-height:104px;}
  .fl-item__ph--none span,.fl-credit{display:none;}
  .fl-item__ph--none svg{width:28px; height:28px;}
  .fl-item__b{gap:6px; padding:11px 12px 12px;}
  .fl-item h4{font-size:.92rem;}
  .fl-item__w{font-size:.74rem;}
  .fl-pill{font-size:.66rem; padding:3px 8px;}
  .fl-item__d{font-size:.78rem; -webkit-line-clamp:2;}
  .fl-notes{grid-template-columns:minmax(0,1fr);}
  .fl-sz__ax{margin:0 0 8px 0;}
  .fl-sz li{grid-template-columns:minmax(0,1fr) 28px; grid-template-areas:"l n" "t t"; row-gap:6px;}
  .fl-sz__l{grid-area:l;} .fl-sz__t{grid-area:t;} .fl-sz li b{grid-area:n;}
  .fl-topc li{grid-template-columns:110px minmax(0,1fr) 24px;}
  .fl-stats > div{padding:16px 14px;}
  .fl-reg__h h3{font-size:1.35rem;}
  .fl-ctl{padding:12px;}
}
@media (prefers-reduced-motion:reduce){ .fl-item,.fl-dots circle{transition:none;} .fl-hero__text{animation:none;} }