/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

:root {
	--cnvs-body-font: "neue-haas-grotesk-text", sans-serif;
	--cnvs-primary-font: "neue-haas-grotesk-display", sans-serif;
	--cnvs-secondary-font: "PPcirka", serif;
}



:root {
	--cnvs-themecolor: #000000;
	--cnvs-themecolor-rgb: 236, 230, 222;
	--cnvs-secondary-color: #CFAE58 !important;

	--cnvs-contrast-bg: orange !important;
	--cnvs-invert-contrast-rgb: orange;

}




/* 1) Face normal (eixo 'wght'; outros eixos ficam livres) */
@font-face {
  font-family: "PPCirka";
  src: url("/fonts/PPCirka-Variable.ttf") format("truetype-variations");
  font-weight: 300 900;        /* ajusta ao range verdadeiro */
  font-style: normal;
  font-display: swap;
}

/* 2) Face itálica, se a fonte tiver eixo 'ital' (0/1) dentro do mesmo ficheiro */
@font-face {
  font-family: "PPCirka";
  src: url("/fonts/PPCirka-Variable.ttf") format("truetype-variations");
  font-weight: 300 900;
  font-style: italic;
  font-display: swap;
  /* Alguns browsers detetam o eixo 'ital' automaticamente; se precisares forçar:
     font-variation-settings: "ital" 1;
  */
}

.cirka { font-family: var(--cnvs-secondary-font); }

em {
  font-family: var(--cnvs-secondary-font);
  font-style: normal !important;
  font-weight: 900;
}


.bgverde {
  background-color: #90a061;
}

.bgorange {
  background-color: #f2900d;
}

.bgbege {
  background-color: #a79e82 !important;
}

.bgpink {
  background-color: #ffccdf !important;
}



.bgcinza {
  background-color: #bcbbbb !important;
}

.bgamarelo {
  background-color: #fdfbe6 !important;
}

.bgazul {

background-color: rgb(219, 242, 255)
}

.border-orange {
  --bs-border-opacity: 1;
  border-color: #ea533f !important;
}





.device-up-lg .dark .section-blogs-lists > li > a:hover h3 {
	color: #cf6132 !important;
}




.bordertop {
  border-radius: 200px 200px 0 0;
}

.rounded-xxl {
  border-radius:25px;
}



.hover-effect {
	-webkit-transition:  transform .25s ease, box-shadow .3s ease;
	-o-transition:  transform .25s ease, box-shadow .3s ease;
	transition:  transform .25s ease, box-shadow .3s ease;
	-webkit-transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	box-shadow: none;
	border: 0;
}

.hover-effect:hover {
	-webkit-transform: translateY(-2px);
	-ms-transform: translateY(-2px);
	-o-transform: translateY(-2px);
	transform: translateY(-2px);
	box-shadow: 20px 20px 0px rgba(0, 0, 0, 1);
}








/* Swiper Tabs */
.swiper-pagination-progress {
	--cnvs-swiper-bar-size: 2px;
	--cnvs-swiper-bar-color:  var(--cnvs-contrast-800);
	--cnvs-swiper-bar-active-color: var(--cnvs-contrast-1000);
	position: absolute;
	left: 0;
	bottom: 0px;
	width: 100%;
	height: auto;
	border-radius: 0;
	opacity: 1;
	margin: 0px;
	background-color: transparent;
}
.swiper-pagination-progress .swiper-pagination-bar,
.swiper-pagination-progress .swiper-pagination-bar-active {
	position: absolute;
	bottom: 0;
	border-radius: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: var(--cnvs-swiper-bar-size);
	margin: 0px;
	background-color: var(--cnvs-swiper-bar-color);
}

.swiper-pagination-progress .swiper-pagination-bar-active {
	z-index: 2;
	width: 0%;
	background-color: var(--cnvs-swiper-bar-active-color);
}
.active .swiper-pagination-progress .swiper-pagination-bar-active {
	animation-name: swiperbarAnim;
	animation-duration: 5s;
	animation-timing-function: ease-in;
	animation-iteration-count: 1;
	animation-direction: alternate;
	animation-fill-mode: forwards;
}
@keyframes swiperbarAnim {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}

.swiper-tab-link {
	--swiper-tab-title: #000;
	--swiper-tab-content: ;
	counter-increment: step-counter;
	position: relative;
	overflow: hidden;
	margin-bottom: 5px;
	padding: 20px 0;
	cursor: pointer;
}

.swiper-tab-link::before {
	content: "0" counter(step-counter)'.';
	position: relative;
	display: inline-block;
    min-width: 50px;
	margin-right: 5px;
	line-height: 1;
	font-family: ppcirka;
	font-size: 2.5rem !important;
}

.swiper-tab-link .swiper-tab-title {
	display: inline-block;
	color: var(--swiper-tab-title);
	margin-bottom: 0;
	
}

.swiper-tab-link .swiper-tab-content {
	margin-bottom: 0;
	padding-top: 10px;
    margin-left: 5px;
	line-height: 0;
	opacity: 0;
	vertical-align:middle;
	transition: line-height 0.6s cubic-bezier(.4,0,.2,1), opacity .1s .1s cubic-bezier(.4,0,.2,1);
}

@media (min-width: 768px) {
    .swiper-tab-link .swiper-tab-content {
        margin-left: 60px;
    }
}

.swiper-tab-link.active .swiper-tab-content {
	opacity: 1;
	line-height: var(--cnvs-line-height-content);
	transition: line-height 0.5s cubic-bezier(.4,0,.2,1), opacity .15s .15s cubic-bezier(.4,0,.2,1);
}

.swiper-tab-link.active {
	--swiper-tab-title: #000;
}


.card-grid {
  --s: 22px;
  --dot: rgba(208,98,50,.50);
  background:
    radial-gradient(circle at 1px 1px, var(--dot) 1px, transparent 1.5px) 0 0 / var(--s) var(--s),
    #fff;
}

/* Grelha com controlo de cores por direção */
.card-grid2{
  /* Geometria */
  --s: 50px;   /* tamanho da célula */
  --t1: 0.5px;   /* espessura linha fina */
  --t2: 0.5px;   /* espessura linha grossa */
  --n: 1000;      /* a cada N células, traço grosso */

  /* Fundo */
  --bg: transparent;

  /* Cores — horizontais */
  --hc1: rgba(131,151,171,0.50);  /* horizontal fina */
  --hc2: rgba(131,151,171,0.50);  /* horizontal grossa */

  /* Cores — verticais */
  --vc1: rgba(200,100,50,.50);  /* vertical fina */
  --vc2: rgba(200,100,50,.50);  /* vertical grossa */

  /* Offset opcional para alinhar a grelha (0 por defeito) */
  --ox: 0px;
  --oy: 0px;

  background-color: var(--bg);
  border-radius: inherit;
  background-clip: padding-box;

  /* Ordem: finas H, finas V, grossas H, grossas V */
  background-image:
    /* horizontais finas */
    repeating-linear-gradient(
      0deg,
      var(--hc1) 0 var(--t1),
      transparent var(--t1) var(--s)
    ),
    /* verticais finas */
    repeating-linear-gradient(
      90deg,
      var(--vc1) 0 var(--t1),
      transparent var(--t1) var(--s)
    ),
    /* horizontais grossas */
    repeating-linear-gradient(
      0deg,
      transparent 0 calc(var(--s)*var(--n) - var(--t2)),
      var(--hc2) calc(var(--s)*var(--n) - var(--t2)) calc(var(--s)*var(--n))
    ),
    /* verticais grossas */
    repeating-linear-gradient(
      90deg,
      transparent 0 calc(var(--s)*var(--n) - var(--t2)),
      var(--vc2) calc(var(--s)*var(--n) - var(--t2)) calc(var(--s)*var(--n))
    );

  background-position:
    var(--ox) var(--oy),
    var(--ox) var(--oy),
    var(--ox) var(--oy),
    var(--ox) var(--oy);
}


/* Espaçamento interno habitual do card (mantém o teu p-4/p-lg-5) */
.card-grid .card-body { position: relative; }


.section-dossier-outline{
  width:100%;
  background:#fff;            /* muda a cor de fundo se precisares */
  overflow:hidden;
  /* opcional: respiro vertical */
  padding-block: clamp(16px, 3vw, 32px);
}

.dossier-hero-svg{
  display:block;
  width:100%;
  height:auto;
  max-width:none;            /* garante full-bleed */
}


.hero {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
}















.block-tab-4 .nav-link {
			padding-top: 5px;
			padding-bottom: 5px;
			
		}

		.block-tab-4 .nav-link.active,
		.block-tab-4 .tab-pane {
			background-color:  rgb(219, 242, 255);
		}

		.block-tab-4 .nav-link:nth-child(2).active,
		.block-tab-4 .tab-pane:nth-child(2) {
			background-color: #f2900d;
		}

		.block-tab-4 .nav-link:nth-child(3).active,
		.block-tab-4 .tab-pane:nth-child(3) {
			background-color: #ffccdf;
		}

		.block-tab-4 .nav-link:nth-child(4).active,
		.block-tab-4 .tab-pane:nth-child(4) {
			background-color: #0f6d60;
		}

		.block-tab-4 .nav-link:nth-child(5).active,
		.block-tab-4 .tab-pane:nth-child(5) {
			background-color: #6d6b0f;
		}

		.block-tab-4 .nav-link:nth-child(6).active,
		.block-tab-4 .tab-pane:nth-child(6) {
			background-color: #0f676d;
		}

		.block-tab-4 .nav-link:nth-child(7).active,
		.block-tab-4 .tab-pane:nth-child(7) {
			background-color: #6d0f55;
		}

		.tabshape {
		border-radius: 10px 10px 0 0;
    margin-left: 70px;
		}

		.tabshape2 {
		border-radius: 10px 10px 0 0;
		}

		.tabshape3 {
		border-radius: 10px 10px 0 0;
		margin-right: 70px;
		}




/* Casos de Estudo — tipografia e ritmo */
.case-dl { margin: 0; }
.case-dl dt {
  margin-top: 1rem;
  margin-bottom: .25rem;
  font-weight: 700;
  text-transform: none;
  letter-spacing: .01em;
}
.case-dl dd {
  margin-left: 0;
  font-size: 1.05rem; /* alinha com o teu corpo de texto */
}

/* Badges suaves (cores em linha com a tua paleta) */
.badge-soft {
  display: inline-block;
  padding: .35rem .6rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .85rem;
  line-height: 1;
}
.badge-azul   { background: #DBF2FF; color: #1b2b34; }
.badge-laranja{ background: #FFD8AD; color: #603A05; }
.badge-rosa   { background: #FFE4EF; color: #5a3042; }



/* Responsivo: mantém legibilidade em 3 colunas só em ≥lg */
@media (min-width: 1200px) {
  .case-dl dd { font-size: 1.1rem; }
}