/* FRANK · FASE 3 — CATALOGO | isolated from approved Hero and Featured Projects. */
.collection-panel{
  position:relative;
  overflow:hidden;
  padding:25px 23px 22px;
  border:1px solid rgba(50,76,116,.55);
  border-radius:12px;
  background:linear-gradient(150deg,#06101e 0%,#030c18 56%,#051120 100%);
}
.collection-panel::before{
  content:"";position:absolute;right:-9%;top:-130px;width:580px;height:250px;
  pointer-events:none;background:radial-gradient(ellipse,rgba(92,51,208,.12),transparent 72%);
}
.collection-panel > *{position:relative}
.collection-panel .panel-heading{align-items:center;gap:18px;margin-bottom:15px}
.collection-panel .panel-title{gap:13px}
.collection-panel .panel-heading h2{font-size:13px;letter-spacing:.23em}
.collection-panel .tiny-rule{width:30px;background:linear-gradient(90deg,#8c83ff,#4fb7fa)}
.collection-panel .project-filters{gap:6px;align-items:center;max-width:940px}
.collection-panel .filter-btn{font-family:var(--font);font-size:10.5px;padding:9px 12px;border-radius:7px;min-height:32px;border-color:#263a57;background:#081323;transition:background .18s,border-color .18s,box-shadow .18s}
.collection-panel .filter-btn:hover{border-color:#6d58b6;background:#17152f}
.collection-panel .filter-btn.selected{background:linear-gradient(135deg,#8144f7,#5b29d7);border-color:#a484ff;box-shadow:0 4px 22px rgba(99,46,214,.32)}
.catalog-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:17px}
.catalog-intro p{margin:0;font-size:12px;line-height:1.6;color:#a4b5d1;max-width:700px}
.catalog-state{display:flex;align-items:center;gap:10px;white-space:nowrap;font-family:var(--mono);color:#a99bf4;font-size:10px;letter-spacing:.06em}
.catalog-state::before{content:"";width:6px;height:6px;border-radius:50%;background:#a66cff;box-shadow:0 0 12px rgba(139,72,245,.45)}
.collection-panel .portfolio-carousel-shell{position:relative}
.collection-panel .more-projects-grid{
  display:grid!important;grid-auto-flow:column;grid-template-columns:none!important;
  grid-auto-columns:calc((100% - 5*13px)/6);gap:13px;
  overflow-x:auto;overscroll-behavior-x:contain;scroll-behavior:smooth;scroll-snap-type:x mandatory;
  scrollbar-width:thin;scrollbar-color:rgba(132,97,209,.5) transparent;
  padding:0 0 9px;align-items:stretch;
}
.collection-panel .more-card{
  min-width:0;min-height:223px;overflow:hidden;scroll-snap-align:start;
  border:1px solid #27405f;border-radius:9px;background:linear-gradient(180deg,#0a1a30,#050e1c 68%);
  display:flex;flex-direction:column;transition:transform .22s,border-color .22s,box-shadow .22s;
}
.collection-panel .more-card:hover,.collection-panel .more-card:focus-within{transform:translateY(-3px);border-color:#7c5bdd;box-shadow:0 12px 32px rgba(38,20,91,.26)}
.collection-panel .more-visual{height:118px;min-height:118px;background:#09172a;position:relative;overflow:hidden;isolation:isolate}
.collection-panel .more-visual img{object-fit:cover;object-position:center 22%;filter:contrast(1.12) saturate(1.11);opacity:.94;transition:transform .28s,filter .28s}
.collection-panel .more-card:hover .more-visual img{transform:scale(1.06);filter:contrast(1.16) saturate(1.24)}
.collection-panel .more-visual:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#07111f 0%,transparent 54%),linear-gradient(90deg,rgba(1,9,20,.14),transparent 80%);pointer-events:none}
.catalog-card-index{position:absolute;top:9px;right:10px;z-index:2;font-family:var(--mono);font-size:9px;letter-spacing:.11em;color:#d2dcf7;text-shadow:0 2px 6px #000;opacity:.9}
.catalog-card-type{position:absolute;top:8px;left:8px;z-index:2;max-width:80%;padding:5px 7px;font-size:9px;font-weight:800;letter-spacing:.025em;border-radius:4px;color:#edddff;background:rgba(102,49,194,.85);border:1px solid rgba(173,139,252,.24);text-transform:uppercase;backdrop-filter:blur(5px)}
.catalog-card-type.corporate{color:#c1deff;background:rgba(20,70,132,.85);border-color:rgba(112,176,244,.22)}
.collection-panel .more-detail{flex:1;display:flex;flex-direction:column;padding:11px 10px 11px;min-height:105px}
.collection-panel .more-detail h3{font-size:12px;font-weight:800;color:#f1f5ff;line-height:1.25;letter-spacing:-.02em;min-height:0;margin:0 0 5px}
.collection-panel .more-detail p{font-size:10px;line-height:1.4;color:#a7bad7;margin:0 0 8px;flex:1}
.collection-panel .more-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-top:auto}
.collection-panel .more-card-bottom>span{font-size:9px;letter-spacing:.06em;color:#8a9ebf;text-transform:uppercase;font-family:var(--mono);max-width:calc(100% - 29px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.collection-panel .more-card-bottom button{display:grid;place-items:center;flex:none;width:27px;height:27px;border-radius:50%;border:1px solid rgba(138,89,229,.9);background:#111228;color:#ccb5ff;font-size:16px;cursor:pointer;transition:background .2s,transform .2s}
.collection-panel .more-card-bottom button:hover{background:#5d2cc0;transform:translateX(2px)}
.collection-panel .carousel-controls{display:flex;align-items:center;gap:18px;margin-top:13px}
.catalog-progress{height:2px;min-width:35px;flex:1;max-width:440px;background:rgba(91,119,161,.22);border-radius:3px;position:relative;overflow:hidden}
.catalog-progress-fill{position:absolute;left:0;top:0;height:100%;width:50%;background:linear-gradient(90deg,#5f9cf9,#aa71ff);border-radius:3px;transition:width .25s,transform .25s}
.collection-panel .project-expand{min-height:37px;border:1px solid #544080;border-radius:6px;background:#0f1229;color:#d6c2ff;font-size:11px;font-weight:700;padding:9px 14px;white-space:nowrap;transition:background .2s,border-color .2s}
.collection-panel .project-expand:hover{background:#251649;border-color:#9468fa}
.collection-panel .carousel-arrows{margin-left:auto;display:flex;gap:7px}
.collection-panel .carousel-arrows button{width:34px;height:34px;border:1px solid #475e82;background:rgba(10,20,42,.9);color:#d4c5ff;border-radius:50%;font-size:17px;cursor:pointer;transition:background .2s,border-color .2s}
.collection-panel .carousel-arrows button:hover:not(:disabled){background:#3d207d;border-color:#a47dff}
.collection-panel .carousel-arrows button:disabled{opacity:.35;cursor:default}
.collection-panel .more-projects-grid.all-visible{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-auto-columns:auto;gap:15px;overflow:visible;scroll-snap-type:none;padding-bottom:0}
.collection-panel .more-projects-grid.all-visible .more-card{min-height:270px}
.collection-panel .more-projects-grid.all-visible .more-visual{height:155px;min-height:155px}
.collection-panel .more-projects-grid.all-visible .more-detail{padding:12px 13px 13px}
.collection-panel .more-projects-grid.all-visible .more-detail h3{font-size:15px}
.collection-panel .more-projects-grid.all-visible .more-detail p{font-size:11.5px}
.collection-panel .more-projects-grid.all-visible .catalog-card-type{font-size:10px}
.collection-panel .more-projects-grid.all-visible + .carousel-controls .catalog-progress{opacity:.2}
.collection-panel .portfolio-disclosure{font-size:10px;line-height:1.65;padding-top:14px;margin-top:14px;border-top:1px solid rgba(50,72,109,.5);color:#889cb9}
.collection-panel .no-results{min-width:250px;color:#b4c4df;line-height:1.6;font-size:13px}
/* All selectors above are scoped to .collection-panel; approved sections are unaffected. */
@media(max-width:1280px){
  .collection-panel .panel-heading{flex-wrap:wrap}
  .collection-panel .project-filters{justify-content:flex-start}
  .collection-panel .more-projects-grid{grid-auto-columns:calc((100% - 4*12px)/5);gap:12px}
  .collection-panel .more-projects-grid.all-visible{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(max-width:1080px){
  .collection-panel .more-projects-grid{grid-auto-columns:calc((100% - 2*13px)/3)}
  .collection-panel .more-projects-grid.all-visible{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .collection-panel .more-card{min-height:245px}.collection-panel .more-visual{height:135px}
}
@media(max-width:760px){
  .collection-panel{padding:19px 13px 20px}
  .collection-panel .panel-heading{gap:13px;margin-bottom:12px;align-items:flex-start}
  .collection-panel .panel-heading h2{font-size:11px;letter-spacing:.15em}
  .collection-panel .project-filters{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%;width:100%;padding-bottom:4px;justify-content:flex-start}
  .collection-panel .project-filters::-webkit-scrollbar{display:none}
  .collection-panel .filter-btn{font-size:10px;padding:8px 11px;flex:none}
  .catalog-intro{align-items:flex-start;margin-bottom:13px;gap:10px}
  .catalog-intro p{font-size:11px}
  .catalog-state{font-size:9px;white-space:normal;text-align:right;flex:0 0 95px}
  .collection-panel .more-projects-grid{grid-auto-columns:clamp(238px,72vw,340px);gap:11px;padding-bottom:9px}
  .collection-panel .more-card{min-height:260px}
  .collection-panel .more-visual{height:148px;min-height:148px}
  .collection-panel .more-detail{padding:12px 12px 13px;min-height:109px}
  .collection-panel .more-detail h3{font-size:15px}
  .collection-panel .more-detail p{font-size:11px}
  .collection-panel .more-projects-grid.all-visible{grid-template-columns:1fr!important;gap:13px}
  .collection-panel .more-projects-grid.all-visible .more-visual{height:185px;min-height:185px}
  .collection-panel .more-projects-grid.all-visible .more-card{min-height:288px}
  .collection-panel .more-projects-grid.all-visible .more-detail h3{font-size:16px}
  .collection-panel .carousel-controls{gap:10px;flex-wrap:wrap}
  .catalog-progress{min-width:50px;max-width:none}
  .collection-panel .project-expand{font-size:10px;padding:8px 10px}
  .collection-panel .carousel-arrows{gap:5px}
  .collection-panel .carousel-arrows button{height:32px;width:32px}
}
@media(prefers-reduced-motion:reduce){.collection-panel *{scroll-behavior:auto!important;transition:none!important}}