/* Cinematic public portfolio; content, project photos and mascot controls stay in the CMS. */
.site-view.projects-view {
  --site-base:#07131f;--site-surface:#142231;--site-text:#f5f7fb;
  --site-muted:#c4cfdb;--site-accent:#f4c27e;--site-on-accent:#102032;
  --text:#f5f7fb;--muted:#c4cfdb;--surface:#142231;--line:#bed8ee2e;
  position:relative;isolation:isolate;color:#f5f7fb;
  background:radial-gradient(ellipse 85% 650px at 0 10%,#c37a2b16,transparent 75%),
             radial-gradient(ellipse 85% 700px at 100% 42%,#4fafff1a,transparent 75%),
             radial-gradient(ellipse 80% 650px at 0 76%,#c37a2b12,transparent 75%),#07131f;
}
.site-view.projects-view::before {
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:url("engineering-wave.svg?v=2") center 180px / max(100%,1600px) auto repeat-y;
  opacity:.3;
}
.projects-view .projects-intro {border-color:#bdd8ee2e}
.projects-view .projects-intro .eyebrow {color:#f1bc83;letter-spacing:.095em}
.projects-view .projects-intro h1 {
  color:#fff;background:linear-gradient(105deg,#fff 18%,#fff 48%,#f3bd77 82%,#ffdca5);
  background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.projects-view .projects-intro .page-intro-copy>p {color:#c4cfdb;line-height:1.8}
.projects-view .projects-intro .button.secondary {
  color:#edf5fd;border:1px solid #bdd8ee50;background:linear-gradient(135deg,#c4def01d,#ffffff08);
  box-shadow:inset 0 1px #fff2,0 5px 18px #0002;border-radius:10px;
}
.projects-view .projects-intro .button.secondary:hover {background:#ffffff1c;border-color:#9bd2ff}
.projects-view .projects-tools {
  display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,310px);
  align-items:end;gap:24px;padding:22px;border:1px solid #bed8ee38;border-radius:15px;
  background:linear-gradient(135deg,#233548a8,#102232b8);
  box-shadow:inset 0 1px #ffffff17,0 12px 30px #0002;backdrop-filter:blur(12px);
}
.projects-view .projects-filter-group {min-width:0}
.projects-view .projects-tool-label {
  display:block;margin:0;color:#d3e1ef;font-size:12px;font-weight:600;line-height:1.6;
}
.projects-view .projects-filter-group>.projects-tool-label {margin-bottom:10px}
.projects-view .project-categories {display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.projects-view .project-categories a {
  padding:9px 12px;font-size:12px;color:#d0dbe8;min-height:42px;
  display:inline-flex;align-items:center;justify-content:space-between;gap:10px;
  border:1px solid #bed8ee40;border-radius:9px;white-space:normal;line-height:1.5;
  background:linear-gradient(135deg,#c4def014,#ffffff04);box-shadow:inset 0 1px #ffffff10;
}
.projects-view .catalog-category-label {min-width:0;overflow-wrap:anywhere}
.projects-view .catalog-category-count {
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  min-width:21px;height:21px;padding:0 5px;border-radius:6px;
  font-size:10px;font-weight:700;color:#d9e9f7;background:#9bd0ff16;
}
.projects-view .project-categories a:hover {background:#ffffff15;border-color:#a1d6ff8a;color:#fff}
.projects-view .project-categories a[aria-current] {
  background:linear-gradient(125deg,#f3d19a,#d9aa67);border-color:#f4d7ad;
  color:#102032;box-shadow:inset 0 1px #fff5,0 3px 13px #e8ba8020;font-weight:700;
}
.projects-view .project-categories a[aria-current] .catalog-category-count {color:#102032;background:#10203216}
.projects-view .projects-search {
  position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;width:100%;margin:0;
}
.projects-view .projects-search input {
  min-height:46px;height:46px;width:100%;padding:10px 44px 10px 13px;
  border:1px solid #bed8ee4a;border-radius:12px;font-size:13px;
  background:linear-gradient(135deg,#1e3043d9,#0d1d2ce8);color:#f5f7fb;color-scheme:dark;
  box-shadow:inset 0 1px #ffffff12,0 8px 24px #0002;
}
.projects-view .projects-search input::placeholder {color:#b6c6d7;opacity:1}
.projects-view .projects-search input:focus {border-color:#9ad6ff;outline:2px solid #9ad6ff55;outline-offset:2px}
.projects-view .projects-search button {
  position:absolute;right:3px;bottom:3px;display:grid;place-items:center;
  height:40px;width:38px;border:0;border-radius:7px;color:#a8d9ff;background:transparent;cursor:pointer;
}
.projects-view .projects-search button:hover {background:#9bd0ff1c;color:#fff}
.projects-view .projects-search button .material-symbols-outlined {font-size:21px}
.projects-view .services-result p {color:#d0dbe8}
.projects-view .services-result .text-link {color:#f4cf9b}
.projects-view .projects-grid {gap:28px}
.projects-view .project-card {
  border:1px solid #ecc38d80;border-radius:17px;
  background:linear-gradient(145deg,#293441ed,#121d29f2 58%,#1b2935ed);
  box-shadow:inset 0 1px #ffffff19,0 15px 38px #0004,0 0 24px #e8ba8012;
  color:#f5f7fb;backdrop-filter:blur(12px);transition:transform .25s,border-color .25s;
}
.projects-view .project-card:nth-child(even) {
  border-color:#9bd0ff85;background:linear-gradient(145deg,#25394eed,#101d2bf2 58%,#1b2b3aed);
  box-shadow:inset 0 1px #ffffff19,0 15px 38px #0004,0 0 24px #69bcff17;
}
.projects-view .project-card .catalog-media {height:300px;min-height:300px;background:#0d1d2c}
.projects-view .project-card .catalog-media::after {
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,#0000001a,transparent 55%,#0d19264d);
}
.projects-view .project-card .home-image-placeholder {
  color:#f4c27e;background:radial-gradient(ellipse at 50% 30%,#456783,#162b3f 65%,#101d2b);
}
.projects-view .project-card .home-image-placeholder>.material-symbols-outlined {font-size:64px}
.projects-view .project-media-badges {top:14px;left:14px;right:14px}
.projects-view .project-media-badges>span {
  padding:5px 10px;border:1px solid #ffffff4a;border-radius:99px;
  color:#fff;background:linear-gradient(135deg,#4b5053c9,#14202ad6);
  box-shadow:inset 0 1px #fff2,0 3px 12px #0002;backdrop-filter:blur(14px);font-size:11px;
}
.projects-view .project-media-badges>.project-area {
  color:#102032;background:linear-gradient(125deg,#f3d19a,#d9aa67);border-color:#f4d7ad;
}
.projects-view .project-card-body {padding:26px}
.projects-view .project-location {color:#bcd4e8;font-size:12px;line-height:1.7;gap:6px;margin-bottom:12px}
.projects-view .project-location .material-symbols-outlined {color:#9ed5ff}
.projects-view .project-card h2 {font-size:23px;line-height:1.35;margin-bottom:13px}
.projects-view .project-card h2 a {color:#fff}
.projects-view .project-card h2 a:hover {color:#f5d6ab}
.projects-view .project-summary {color:#cbd4de;font-size:14px;line-height:1.75;margin-bottom:20px}
.projects-view .project-results {border-color:#d3e1ef2e;padding-top:17px;gap:8px}
.projects-view .project-results li {color:#d0dbe8;font-size:12px;line-height:1.7;gap:8px}
.projects-view .project-results .material-symbols-outlined {color:#9ed5ff;font-size:17px}
.projects-view .project-card-footer {border-color:#d3e1ef2e;padding-top:19px;gap:18px;flex-wrap:wrap}
.projects-view .project-card-footer>span {font-size:12px;color:#f4cf9b;line-height:1.7}
.projects-view .project-card-footer>.button {
  border:1px solid #ffb879;border-radius:9px;min-height:44px;padding:10px 14px;
  color:#fff;background:linear-gradient(110deg,#ca471d,#a54c12);font-size:12px;
  box-shadow:inset 0 1px #fff3,0 4px 18px #ff782020;font-weight:700;
}
.projects-view .project-card-footer>.button:hover {background:linear-gradient(110deg,#b43c16,#8e3e0c);color:#fff}
.projects-view .services-empty {
  border:1px solid #9bd0ff65;border-radius:17px;color:#f5f7fb;
  background:linear-gradient(135deg,#24384cd9,#112334e8);box-shadow:inset 0 1px #fff2,0 15px 35px #0003;
}
.projects-view .services-empty>.material-symbols-outlined {color:#f4c27e}
.projects-view .services-empty h2 {color:#fff}
.projects-view .services-empty p {color:#c4cfdb}
.projects-view .services-empty .button.secondary {
  color:#eef4fc;border:1px solid #c0d8ee50;background:linear-gradient(135deg,#c4def01d,#ffffff08);
}
.projects-view .main-content a:focus-visible,.projects-view .projects-search button:focus-visible {
  outline:3px solid #a1d6ff;outline-offset:4px;border-radius:7px;
}
/* Ecology and roofing setting behind the original portfolio mascot. */
.projects-view .page-mascot .mascot-halo {
  inset:-4%;border:0;border-radius:0;box-shadow:none;
  background:transparent url("content/bento-ecologia-obras-v1.webp") center/contain no-repeat;
  mask-image:radial-gradient(ellipse 50% 54% at 50% 51%,#000 69%,#000b 83%,transparent 100%);
}
.projects-view .page-mascot .mascot-blueprint,
.projects-view .page-mascot .mascot-orbit,
.projects-view .page-mascot .mascot-node {display:none}
.projects-view .page-mascot .mascot-ground {
  left:20%;right:20%;bottom:4%;height:7%;
  background:radial-gradient(ellipse,#03120b99,transparent 70%);filter:blur(4px);
}
.projects-view .mascot-stage:hover .mascot-halo {box-shadow:none}
.projects-view .page-mascot .mascot-badge {
  border-color:#c4d7a94d;color:#f5f7fb;
  background:linear-gradient(135deg,#233c35f2,#12282af0);box-shadow:0 12px 30px #0004,inset 0 1px #ffffff12;
}
.projects-view .page-mascot .mascot-badge-icon,.projects-view .page-mascot .mascot-name-mark {
  color:#f2dbb4;background:#c5d7ab17;
}
@media(max-width:1100px) {
  .projects-view .projects-tools {grid-template-columns:1fr;gap:20px}
}
@media(max-width:1000px) {
  .projects-view .projects-grid {gap:24px}
  .projects-view .project-card .catalog-media {height:260px;min-height:260px}
}
@media(max-width:740px) {
  .projects-view .page-mascot .mascot-badge-topic {top:0;left:0;max-width:44%}
}
@media(max-width:700px) {
  .projects-view .projects-tools {padding:17px;gap:22px}
  .projects-view .project-categories {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;width:100%}
  .projects-view .project-categories a {font-size:12px;padding:10px 12px;min-height:44px}
  .projects-view .project-categories a:last-child:nth-child(odd) {grid-column:1/-1}
  .projects-view .projects-grid {gap:23px}
  .projects-view .project-card .catalog-media {height:235px;min-height:235px}
  .projects-view .project-card-body {padding:24px}
  .projects-view .project-card h2 {font-size:22px}
  .site-view.projects-view::before {background-size:max(100%,1000px) auto;opacity:.22}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .projects-view .project-card:hover {transform:translateY(-5px);border-color:#f3d4a7}
  .projects-view .project-card:nth-child(even):hover {border-color:#b9e4ff}
}
@media(prefers-reduced-motion:reduce) {
  .projects-view .project-card,.projects-view .catalog-media>img,.projects-view .project-categories a {transition:none}
  .projects-view .project-card:hover,.projects-view .project-card:hover .catalog-media>img {transform:none}
}
@media(forced-colors:active) {
  .site-view.projects-view {background:Canvas;color:CanvasText}
  .site-view.projects-view::before,.projects-view .page-mascot .mascot-halo {display:none}
  .projects-view .projects-intro h1 {background:none;-webkit-text-fill-color:CanvasText}
  .projects-view .project-card,.projects-view .project-categories {background:Canvas;border-color:CanvasText}
  .projects-view .page-mascot .mascot-badge {background:Canvas;color:CanvasText;border-color:CanvasText}
}

/* Editable copy can exceed the length of the original labels. */
.projects-view #projects-grid {scroll-margin-top:110px}
.projects-view .projects-tool-label,.projects-view .project-location,.projects-view .project-card-footer,.projects-view .services-empty {overflow-wrap:anywhere}
.projects-view .project-card-footer>.button {white-space:normal;max-width:100%;min-width:0;line-height:1.6;text-align:center}