/* =========================================================================
   Portfolio projekts (single-portfolio.php), jaunais stils (30.10.2026)
   Figma 2271:4386 desktop, 2272:7241 mobilais. Kartītes: assets/css/v3-cards.css.
   Projektu ekrāni bez pārlūka joslas, telefons ar noapaļotu rāmi. Nekas neritinās rāmī.
   ========================================================================= */

.sec-head{ align-items:stretch; } /* v3.css .sec-head paliek ar base.css align-items:start */
.prj-head{ margin-bottom:40px; }
.prj-head .sec-head__main > .h2{ max-width:760px; }
.prj-head .sec-head__side{ max-width:460px; margin:0; }
.bg-ink .prj-head .sec-head__side{ color:var(--on-black-muted); }

/* ---------- Ceļš ---------- */
.pf-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:13px; font-weight:500; line-height:1.5; color:var(--muted); }
.pf-crumbs a{ color:var(--muted); transition:color 200ms var(--ease-v3); }
.pf-crumbs a:hover{ color:var(--ink); }
.pf-crumbs [aria-current]{ color:var(--ink); }

/* ---------- Hero ---------- */
.prj-hero{ padding:56px 0 var(--sec-y); background:var(--white); color:var(--ink); }
.prj-hero__row{ display:flex; align-items:flex-end; justify-content:space-between; gap:48px; margin-top:40px; }
.prj-hero__text{ flex:0 1 800px; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:24px; }
.prj-tags{ display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.prj-tags li{ padding:5px 10px; border-radius:var(--r-pill); background:var(--panel); font-size:13px; font-weight:500; line-height:1.5; color:var(--ink); }
.prj-hero__h1{ margin:0; font-size:var(--fs-h1); font-weight:500; line-height:1.1; letter-spacing:-0.045em; color:var(--ink); text-wrap:balance; }
.prj-hero__h1 .c-signal{ color:inherit; }
.prj-hero__intro{ margin:0; font-size:var(--fs-lead); line-height:1.56; letter-spacing:-0.012em; color:var(--muted); }
.prj-hero__ctas{ display:flex; flex-wrap:wrap; gap:10px; }
.prj-facts{
  flex:0 1 520px; min-width:0; margin:0; padding:12px 28px; border-radius:28px;
  background:radial-gradient(56% 50% at 50% 50%, rgba(255,255,255,.9), rgba(255,255,255,0)) var(--panel);
}
.prj-facts__row{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:14px 0; border-bottom:1px solid rgba(17, 19, 21, 0.08); }
.prj-facts__row:last-child{ border-bottom:0; }
.prj-facts dt{ flex:none; font-size:13px; font-weight:500; line-height:1.5; color:var(--muted); }
.prj-facts dd{ margin:0; min-width:0; font-size:15px; line-height:1.58; text-align:right; color:var(--ink); }

/* Skatlogs */
.prj-view{ margin-top:52px; }
.prj-view__panel{
  position:relative; overflow:hidden; aspect-ratio:1500 / 760; border-radius:28px;
  background:radial-gradient(56% 50% at 50% 50%, rgba(255,255,255,.9), rgba(255,255,255,0)) var(--panel);
}
.prj-view__desk{
  position:absolute; left:6.67%; top:calc(8.4% + 46px); width:76%; aspect-ratio:16 / 10; overflow:hidden;
  border-radius:14px 14px 0 0; background:var(--white); box-shadow:0 8px 32px rgba(18, 20, 23, 0.14);
}
.prj-view__panel:not(.has-phone) .prj-view__desk{ left:12%; width:76%; }
.prj-view__phone{
  position:absolute; left:76.67%; top:19.74%; width:16.67%; aspect-ratio:390 / 844; overflow:hidden;
  border:4px solid var(--ink); border-radius:28px; background:var(--ink); box-shadow:0 8px 32px rgba(18, 20, 23, 0.22);
}
.prj-view__shot{ position:absolute; inset:0; opacity:0; transition:opacity 500ms var(--ease-v3); }
.prj-view__shot.is-on{ opacity:1; }
.prj-view__phone .prj-view__shot{ border-radius:22px; overflow:hidden; }
.prj-view__shot img{ display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.prj-view__shot img.is-cover{ object-position:center; }
.prj-view__switch{ position:absolute; z-index:3; left:6.67%; top:8.4%; display:flex; flex-wrap:wrap; gap:6px; max-width:76%; }
.prj-view__btn{
  position:relative; overflow:hidden; display:inline-flex; align-items:center; height:30px; padding:0 10px; border:0; border-radius:var(--r-pill);
  background:var(--white); color:var(--ink); font:inherit; font-size:13px; font-weight:500; line-height:1; cursor:pointer;
  transition:background-color 200ms var(--ease-v3), color 200ms var(--ease-v3);
}
.prj-view__btn[aria-pressed="true"]{ background:var(--ink); color:var(--white); }
.prj-view__btn i{ position:absolute; left:10px; right:10px; bottom:4px; height:2px; border-radius:1px; background:var(--signal-soft); transform:scaleX(0); transform-origin:left; opacity:0; }
.prj-view.is-run .prj-view__btn[aria-pressed="true"] i{ opacity:1; animation:prj-run var(--stage-dur, 4200ms) linear forwards; }
@keyframes prj-run{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
@media (hover: hover) and (pointer: fine){
  .prj-view__btn[aria-pressed="false"]:hover{ background:var(--btn-2-hover); }
}
.prj-view__src{ margin:16px 0 0; font-size:13px; font-weight:500; line-height:1.5; color:var(--muted); }
.js .prj-view .prj-view__phone{ opacity:0; transform:translate3d(0, 32px, 0); }
.js .prj-view.is-in .prj-view__phone{ opacity:1; transform:none; transition:opacity 700ms var(--ease-v3) 200ms, transform 700ms var(--ease-v3) 200ms; }

/* ---------- Uzdevums un risinājums ---------- */
.prj-task__cols{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.prj-task__card{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:36px; border-radius:28px; background:var(--white); }
.prj-chip{ display:inline-block; padding:5px 10px; border-radius:var(--r-pill); background:var(--panel); font-size:13px; font-weight:500; line-height:1.5; color:var(--ink); }
.prj-chip--signal{ background:var(--signal-soft); }
.prj-task__title{ margin:0; font-size:var(--fs-h3); font-weight:500; line-height:1.2; letter-spacing:-0.045em; color:var(--ink); }
.prj-task__text{ margin:0; font-size:15px; line-height:1.58; color:var(--muted); }
.prj-feats{ margin-top:40px; }
.prj-feats__label{ display:block; margin:0 0 14px; }
.prj-feats__list{ display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.prj-feats__list li{ padding:8px 13px; border-radius:var(--r-pill); background:var(--white); font-size:13px; font-weight:500; line-height:1.5; color:var(--ink); }

/* ---------- Dzīvā lapa ---------- */
.prj-live__row{ display:grid; grid-template-columns:minmax(0, 960fr) minmax(0, 520fr); gap:20px; align-items:stretch; }
.prj-pages{
  margin:0; padding:12px 30px; list-style:none; border-radius:28px;
  background:radial-gradient(56% 50% at 50% 50%, rgba(255,255,255,.9), rgba(255,255,255,0)) var(--panel);
}
.prj-pages li + li{ border-top:1px solid rgba(17, 19, 21, 0.08); }
.prj-pages__row{ display:grid; grid-template-columns:minmax(0, 1fr) auto auto; align-items:center; gap:16px; padding:20px 0; color:var(--ink); text-decoration:none; }
.prj-pages__name{ min-width:0; font-size:24px; font-weight:500; line-height:1.25; letter-spacing:-0.04em; transition:color 200ms var(--ease-v3); }
.prj-pages__url{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; line-height:1.5; color:var(--muted); }
.prj-pages__go{ font-size:13px; font-weight:500; line-height:1.5; text-decoration:underline; text-underline-offset:3px; }
@media (hover: hover) and (pointer: fine){
  .prj-pages__row:hover .prj-pages__name, .prj-pages__row:hover .prj-pages__go{ color:var(--signal); }
}
.prj-cd{ display:flex; flex-direction:column; gap:16px; padding:32px; border-radius:28px; background:var(--ink); color:var(--white); }
.prj-cd__title{ margin:0; font-size:13px; font-weight:500; line-height:1.5; color:var(--on-black-muted); }
.prj-cd__nums{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; }
.prj-cd__nums > div{ display:flex; flex-direction:column; gap:2px; padding:16px; border-radius:16px; background:var(--ink-3); }
.prj-cd__n{ font-size:clamp(28px, 2vw, 36px); font-weight:500; line-height:1.15; letter-spacing:-0.03em; font-variant-numeric:tabular-nums; }
.prj-cd__nums small{ font-size:13px; font-weight:500; line-height:1.5; color:var(--on-black-muted); }
.prj-cd__note{ margin:0; font-size:15px; line-height:1.5; color:var(--white); }
.prj-cd__domain{ margin:-8px 0 0; font-size:var(--fs-h3); font-weight:500; line-height:1.2; letter-spacing:-0.045em; }
.prj-cd__facts{ display:grid; gap:0; margin:0; }
.prj-cd__facts > div{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:12px 0; border-top:1px solid rgba(255, 255, 255, 0.1); }
.prj-cd__facts dt{ flex:none; font-size:13px; font-weight:500; color:var(--on-black-muted); }
.prj-cd__facts dd{ margin:0; font-size:15px; text-align:right; }
.prj-cd__btn{ align-self:flex-start; margin-top:auto; }

/* ---------- Skaitļi ---------- */
.prj-nums .label{ color:var(--on-black-muted); }
.prj-nums__grid{ display:grid; grid-template-columns:repeat(var(--n, 4), minmax(0, 1fr)); gap:20px; margin:0; }
.prj-nums__item{ display:flex; flex-direction:column-reverse; justify-content:flex-end; gap:8px; min-height:160px; padding:28px; border-radius:24px; background:var(--ink-2); }
.prj-nums__num{ margin:0; font-size:clamp(44px, 3.4vw, 64px); font-weight:500; line-height:1; letter-spacing:-0.04em; color:var(--white); font-variant-numeric:tabular-nums; }
.prj-nums__text{ font-size:15px; line-height:1.5; color:var(--on-black-muted); }

/* ---------- Līdzīgi projekti ---------- */
.prj-rel__side{ display:flex; align-items:center; gap:16px; max-width:none; }
.prj-rel__count{ margin:0; font-size:13px; font-weight:500; color:var(--muted); white-space:nowrap; }
.prj-rel__track{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px; }
.prj-rel__item{ min-width:0; }
.prj-rel__item .pf-card{ height:100%; }
.prj-rel__foot{ display:none; }

/* ---------- Atsaucīgums ---------- */
@media (max-width: 1280px){
  .prj-hero__row{ align-items:stretch; }
  .prj-live__row{ grid-template-columns:1fr; }
}
@media (max-width: 1024px){
  .prj-hero__row{ flex-direction:column; gap:32px; }
  .prj-hero__text, .prj-facts{ flex:none; max-width:720px; width:100%; }
  .prj-nums__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .prj-rel__track{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .prj-rel__item:nth-child(3){ display:none; }
}
@media (max-width: 767px){
  .prj-hero{ padding-top:24px; }
  .prj-hero__row{ margin-top:16px; gap:24px; }
  .prj-hero__text{ gap:20px; }
  .prj-hero__ctas{ flex-direction:column; align-items:stretch; width:100%; }
  .prj-hero__ctas .btn{ width:100%; }
  .prj-facts{ padding:6px 18px; border-radius:24px; }
  .prj-facts__row{ padding:13px 0; }
  .prj-view{ margin-top:32px; }
  .prj-view__panel{ aspect-ratio:350 / 350; border-radius:24px; }
  .prj-view__desk{ left:4%; top:8%; width:78%; border-radius:8px; }
  .prj-view__phone{ left:47%; top:30%; width:38%; border-width:3px; border-radius:20px; }
  .prj-view__phone .prj-view__shot{ border-radius:17px; }
  .prj-view__switch{ display:none; }
  .prj-view__src{ margin-top:12px; }
  .prj-head{ margin-bottom:28px; }
  .prj-task__cols{ grid-template-columns:1fr; gap:16px; }
  .prj-task__card{ padding:24px 20px; border-radius:24px; gap:12px; }
  .prj-feats{ margin-top:28px; }
  .prj-feats__list li{ padding:6px 11px; }
  .prj-pages{ padding:6px 18px; border-radius:24px; }
  .prj-pages__row{ grid-template-columns:minmax(0, 1fr) auto; grid-template-areas:"name go" "url go"; gap:2px 12px; padding:16px 0; }
  .prj-pages__name{ grid-area:name; font-size:20px; }
  .prj-pages__url{ grid-area:url; font-size:13px; }
  .prj-pages__go{ grid-area:go; }
  .prj-live__row{ gap:16px; }
  .prj-cd{ padding:24px 20px; border-radius:24px; }
  .prj-cd__nums{ gap:8px; }
  .prj-cd__nums > div{ padding:12px; border-radius:12px; }
  .prj-nums__grid{ gap:12px; }
  .prj-nums__item{ min-height:0; padding:20px 16px; border-radius:20px; }
  .prj-nums__num{ font-size:clamp(34px, 9vw, 44px); }
  .prj-nums__text{ font-size:13px; }
  .prj-rel__side{ display:none; }
  .prj-rel__track{
    display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
    margin:0 calc(var(--gutter) * -1); padding:0 var(--gutter); scroll-padding:0 var(--gutter);
  }
  .prj-rel__track::-webkit-scrollbar{ display:none; }
  .prj-rel__item, .prj-rel__item:nth-child(3){ display:block; flex:0 0 82%; scroll-snap-align:start; }
  .prj-rel__foot{ display:block; margin-top:24px; }
  .prj-rel__foot .btn{ width:100%; }
}
@media (prefers-reduced-motion: reduce){
  .js .prj-view .prj-view__phone{ opacity:1; transform:none; transition:none; }
  .prj-view__shot{ transition:none; }
  .prj-view.is-run .prj-view__btn[aria-pressed="true"] i{ animation:none; opacity:0; }
}
html.reduced .prj-view .prj-view__phone{ opacity:1; transform:none; }

/* 31.10.2026: «Lapa tiešsaistē», ja sadaļu ir mazāk par tumšās kartītes augstumu, rindas centrējas un apakšā nepaliek tukšs pelēks laukums. */
@media (min-width: 1025px){
  .prj-pages{ display:flex; flex-direction:column; justify-content:center; }
}