/* Verant Studio — shared project case-study system
   Used by Farmářka and Farma přírody. ProfiClips keeps its bespoke case-study layout. */

.project-case-page {
  --case-ink:#4b2f21;
  --case-muted:#76645a;
  --case-accent:#f17735;
  --case-surface:#fffaf7;
  --case-surface-soft:#f5ece7;
  --case-line:rgba(117,73,34,.12);
  background:#ede5e3;
}

.project-case-page main { overflow:clip; }

.project-case-page .ux-audit-hero-hero.project-case-hero-shell {
  width:min(1440px,100%);
  max-width:none;
  margin:0 auto;
  padding:clamp(112px,11vw,150px) 24px clamp(42px,6vw,72px);
  position:relative;
  overflow:hidden;
  border:1px solid var(--case-line);
  border-top:0;
  border-radius:0 0 clamp(40px,6vw,76px) clamp(40px,6vw,76px);
  background:
    radial-gradient(circle at 89% 13%,rgba(241,119,53,.15),transparent 29%),
    radial-gradient(circle at 7% 88%,rgba(117,73,34,.07),transparent 27%),
    linear-gradient(145deg,#f1ddd2 0%,#f7eee9 50%,#e8dcd7 100%);
  box-shadow:0 30px 76px rgba(63,35,11,.09);
}

.project-case-page--nature .ux-audit-hero-hero.project-case-hero-shell {
  background:
    radial-gradient(circle at 89% 13%,rgba(241,119,53,.13),transparent 30%),
    radial-gradient(circle at 9% 88%,rgba(89,105,73,.10),transparent 29%),
    linear-gradient(145deg,#e8dfd2 0%,#f5eee8 50%,#e1ddd2 100%);
}

.project-case-page .project-case-hero {
  width:min(1180px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
  gap:clamp(30px,5vw,72px);
  align-items:center;
}

.project-case-page .project-case-hero__copy { min-width:0; }

.project-case-page .project-case-kicker,
.project-case-page .case-hero__eyebrow2 {
  display:inline-flex;
  width:auto;
  align-items:center;
  gap:9px;
  margin:0 0 18px;
  padding:9px 14px;
  border:1px solid rgba(117,73,34,.12);
  border-radius:999px;
  background:rgba(255,250,247,.68);
  color:#9d5733;
  font-family:"Barlow",sans-serif;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.project-case-page .case-hero__eyebrow2 em { font-style:normal; }

.project-case-page .project-case-hero h1,
.project-case-page .project-case-hero h2 {
  max-width:850px;
  margin:0 0 24px;
  color:var(--case-ink);
  font-family:"DM Serif Display",serif;
  font-weight:400;
  font-size:clamp(2.55rem,5.4vw,5.2rem);
  line-height:.99;
  letter-spacing:-.035em;
}

.project-case-page .project-case-hero h2 strong { color:#b4582d; font-weight:400; }

.project-case-page .project-case-hero__copy > p:not(.project-case-kicker):not(.case-hero__eyebrow2) {
  max-width:760px;
  margin:0 0 17px;
  color:#69564b;
  font-size:clamp(1.04rem,1.6vw,1.22rem);
  line-height:1.64;
}

.project-case-page .project-case-hero__copy > p strong { color:#4b3024; }

.project-case-page .project-case-hero .cta-hero-podstranky {
  margin:30px 0 0;
}

.project-case-page .project-case-hero > .hero-image {
  position:relative;
  width:100%;
  min-width:0;
  margin:0;
  padding:12px;
  border-radius:30px;
  background:rgba(255,250,247,.55);
  border:1px solid rgba(117,73,34,.12);
  box-shadow:0 26px 58px rgba(63,35,11,.11);
  transform:perspective(1100px) rotateX(var(--case-tilt-y,0deg)) rotateY(var(--case-tilt-x,0deg));
  transition:transform 180ms ease,box-shadow 220ms ease;
  will-change:transform;
}

.project-case-page .project-case-hero > .hero-image::before {
  content:"CASE STUDY · VERANT STUDIO";
  display:block;
  padding:3px 4px 11px;
  color:#8c7568;
  font-family:"Barlow",sans-serif;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.12em;
}

.project-case-page .project-case-hero > .hero-image img {
  display:block;
  width:100%;
  height:auto;
  max-height:620px;
  object-fit:cover;
  border-radius:21px;
  border:1px solid rgba(117,73,34,.08);
}

.project-case-page .case-summary {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:clamp(28px,5vw,52px) 0 0;
}

.project-case-page .case-summary__item {
  min-width:0;
  padding:20px 21px;
  border-radius:20px;
  background:rgba(255,250,247,.72);
  border:1px solid rgba(117,73,34,.105);
  box-shadow:0 12px 26px rgba(63,35,11,.035);
}

.project-case-page .case-summary__label {
  display:block;
  margin-bottom:8px;
  color:#a85a33;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.project-case-page .case-summary__item p {
  margin:0;
  color:#635146;
  font-size:.97rem;
  line-height:1.48;
}

.project-case-page .case-summary__item strong { color:#4b3024; }

/* Farmářka desktop showcase -------------------------------------------------
   Keep the approved phone/tablet layout untouched. On desktop the original
   headline was too large for its column, forcing a very tall hero and making
   the mockup feel secondary. This composition treats the page as a studio
   case-study cover: editorial copy + dominant product visual + compact facts. */
@media (min-width:901px) {
  .project-case-page--farmarka .ux-audit-hero-hero.project-case-hero-shell {
    padding:clamp(116px,9vw,142px) clamp(28px,4vw,58px) clamp(46px,5vw,68px);
    background:
      radial-gradient(circle at 78% 30%,rgba(241,119,53,.16),transparent 29%),
      radial-gradient(circle at 95% 4%,rgba(255,255,255,.48),transparent 20%),
      radial-gradient(circle at 6% 88%,rgba(117,73,34,.06),transparent 25%),
      linear-gradient(145deg,#f1ddd2 0%,#f8f0eb 48%,#eaded8 100%);
  }

  .project-case-page--farmarka .project-case-hero {
    width:min(1280px,100%);
    grid-template-columns:minmax(0,.92fr) minmax(500px,1.08fr);
    grid-template-rows:auto auto;
    column-gap:clamp(54px,6vw,92px);
    row-gap:clamp(34px,4vw,48px);
    align-items:center;
  }

  .project-case-page--farmarka .project-case-hero__copy {
    grid-column:1;
    grid-row:1;
    align-self:center;
    max-width:610px;
    padding:10px 0 4px;
  }

  .project-case-page--farmarka .project-case-hero__copy .case-hero__eyebrow2,
  .project-case-page--farmarka .project-case-hero__copy .project-case-kicker {
    margin-bottom:20px;
    padding:8px 12px;
    font-size:.68rem;
    letter-spacing:.105em;
  }

  .project-case-page--farmarka .project-case-hero__copy .margin-top {
    margin:0!important;
    padding:0!important;
  }

  .project-case-page--farmarka .project-case-hero h1,
  .project-case-page--farmarka .project-case-hero h2 {
    max-width:590px;
    margin:0 0 26px;
    font-size:clamp(3.25rem,4.15vw,4.65rem);
    line-height:.94;
    letter-spacing:-.038em;
    text-wrap:balance;
  }

  .project-case-page--farmarka .project-case-hero__copy > p:not(.project-case-kicker):not(.case-hero__eyebrow2) {
    max-width:570px;
    margin:0 0 14px;
    font-size:clamp(.96rem,1.03vw,1.06rem);
    line-height:1.68;
  }

  .project-case-page--farmarka .project-case-hero__copy > p:not(.project-case-kicker):not(.case-hero__eyebrow2):last-of-type {
    margin-top:18px;
    padding:16px 18px;
    border-left:3px solid rgba(241,119,53,.78);
    border-radius:0 16px 16px 0;
    background:rgba(255,250,247,.52);
    box-shadow:0 12px 32px rgba(63,35,11,.035);
  }

  .project-case-page--farmarka .project-case-hero .cta-hero-podstranky {
    margin-top:25px;
  }

  .project-case-page--farmarka .project-case-hero > .hero-image {
    grid-column:2;
    grid-row:1;
    align-self:center;
    width:100%;
    max-width:650px;
    justify-self:end;
    padding:15px;
    border-radius:34px;
    background:rgba(255,250,247,.72);
    border-color:rgba(117,73,34,.12);
    box-shadow:
      0 36px 90px rgba(63,35,11,.14),
      0 0 0 1px rgba(255,255,255,.28) inset;
  }

  .project-case-page--farmarka .project-case-hero > .hero-image::before {
    padding:4px 5px 12px;
    color:#8d6956;
  }

  .project-case-page--farmarka .project-case-hero > .hero-image::after {
    content:"OBJEDNÁVKY · DOSTUPNOST · PROVOZ";
    position:absolute;
    right:18px;
    bottom:-16px;
    z-index:4;
    display:inline-flex;
    align-items:center;
    min-height:35px;
    padding:0 14px;
    border-radius:999px;
    background:#5f4438;
    border:1px solid rgba(255,255,255,.10);
    color:#fffaf7;
    box-shadow:0 13px 30px rgba(63,35,11,.17);
    font-family:"Barlow",sans-serif;
    font-size:.62rem;
    font-weight:800;
    letter-spacing:.07em;
  }

  .project-case-page--farmarka .project-case-hero > .hero-image img {
    width:100%;
    max-height:none;
    aspect-ratio:16 / 9;
    object-fit:cover;
    border-radius:23px;
  }

  .project-case-page--farmarka .case-summary {
    grid-column:1/-1;
    grid-row:2;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:0;
    padding-top:6px;
  }

  .project-case-page--farmarka .case-summary__item {
    min-height:100%;
    padding:17px 18px;
    border-radius:18px;
    background:rgba(255,250,247,.76);
    backdrop-filter:blur(12px);
    box-shadow:0 11px 28px rgba(63,35,11,.035);
  }

  .project-case-page--farmarka .case-summary__label {
    margin-bottom:6px;
    font-size:.64rem;
  }

  .project-case-page--farmarka .case-summary__item p {
    font-size:.86rem;
    line-height:1.43;
  }
}

.project-case-page .project-case-content {
  width:min(1000px,calc(100% - 40px));
  max-width:none;
  margin:clamp(58px,8vw,96px) auto 0;
  padding:0;
}

.project-case-page .project-case-section {
  width:100%;
  max-width:none;
  margin:0 0 28px;
  padding:clamp(27px,4vw,44px);
  border-radius:28px;
  background:rgba(255,250,247,.78);
  border:1px solid var(--case-line);
  box-shadow:0 18px 46px rgba(63,35,11,.045);
}

.project-case-page .project-case-section > h3,
.project-case-page .project-case-content > h3 {
  position:relative;
  margin:0 0 20px;
  padding:0;
  color:var(--case-ink);
  font-family:"DM Serif Display",serif;
  font-size:clamp(2rem,4vw,3.5rem);
  font-weight:400;
  line-height:1.04;
}

.project-case-page .case-section__eyebrow {
  display:inline-flex;
  margin:20px 0 10px;
  color:#b35b30;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.project-case-page .project-case-section p,
.project-case-page .project-case-content > p,
.project-case-page .project-case-section li {
  color:#6e5e55;
  font-size:1.08rem;
  line-height:1.72;
}

.project-case-page .project-case-section p strong,
.project-case-page .project-case-content > p strong,
.project-case-page .project-case-section li strong { color:#4d3529; }

.project-case-page .project-case-section ul {
  margin:22px 0 0;
  padding:0;
  list-style:none;
  border-left:0!important;
  display:grid;
  gap:10px;
}

.project-case-page .project-case-section li {
  position:relative;
  padding:14px 16px 14px 48px;
  border-radius:16px;
  background:rgba(245,236,231,.72);
  border:1px solid rgba(117,73,34,.08);
}

.project-case-page .project-case-section li::before {
  content:"✓";
  position:absolute;
  left:16px;
  top:13px;
  display:grid;
  place-items:center;
  width:23px;
  height:23px;
  border-radius:50%;
  color:#c35d2a;
  background:rgba(241,119,53,.10);
  font-weight:800;
  font-size:.82rem;
}

.project-case-page .case-quote {
  margin:30px 0;
  padding:clamp(24px,4vw,38px);
  border:0;
  border-radius:26px;
  background:
    radial-gradient(circle at 88% 10%,rgba(241,119,53,.13),transparent 31%),
    linear-gradient(145deg,#765346 0%,#634538 57%,#51372f 100%);
  box-shadow:0 24px 58px rgba(63,35,11,.12);
}

.project-case-page .case-quote p { color:#eee1d9; }
.project-case-page .case-quote p strong { color:#fffaf7; }
.project-case-page .case-quote span { color:#e3d1c6; }

.project-case-page .project-case-media,
.project-case-page .project-case-content .hero-image {
  width:100%;
  margin:36px 0;
  padding:10px;
  border-radius:28px;
  background:#fffaf7;
  border:1px solid var(--case-line);
  box-shadow:0 20px 50px rgba(63,35,11,.07);
}

.project-case-page .project-case-media img,
.project-case-page .project-case-content .hero-image img {
  display:block;
  width:100%;
  height:auto;
  border-radius:20px;
}

.project-case-page .cta.project-case-cta {
  margin:clamp(54px,8vw,88px) 0 0;
  padding:clamp(30px,5vw,54px);
  border-radius:30px;
  border:1px solid rgba(255,244,236,.12);
  background:
    radial-gradient(circle at 88% 12%,rgba(241,119,53,.15),transparent 31%),
    linear-gradient(145deg,#735244 0%,#614438 55%,#4b342c 100%);
  box-shadow:0 26px 66px rgba(63,35,11,.13);
}

.project-case-page .cta.project-case-cta h3 { color:#fffaf7; }
.project-case-page .cta.project-case-cta p { color:#e5d8d0; }

.project-case-page .faq-section {
  width:min(920px,calc(100% - 40px));
  margin:clamp(70px,9vw,110px) auto 80px;
}

.project-case-page .faq-section > h3 {
  font-size:clamp(2.2rem,4.3vw,3.8rem);
}

.project-case-page .faq-item {
  border-radius:20px;
  border-color:rgba(117,73,34,.12);
  background:rgba(255,250,247,.72);
}

.project-case-page .project-case-reveal {
  opacity:0;
  transform:translateY(20px);
  transition:opacity 620ms ease,transform 720ms cubic-bezier(.22,.8,.2,1);
}
.project-case-page .project-case-reveal.is-visible { opacity:1; transform:none; }

@media (hover:hover) and (pointer:fine) {
  .project-case-page .case-summary__item,
  .project-case-page .project-case-section {
    transition:transform 220ms ease,box-shadow 220ms ease,border-color 220ms ease;
  }
  .project-case-page .case-summary__item:hover,
  .project-case-page .project-case-section:hover {
    transform:translateY(-3px);
    border-color:rgba(241,119,53,.18);
    box-shadow:0 24px 56px rgba(63,35,11,.07);
  }
}

@media (max-width:900px) {
  .project-case-page .project-case-hero { grid-template-columns:minmax(0,1fr); }
  .project-case-page .project-case-hero > .hero-image { max-width:760px; }
  .project-case-page .case-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:650px) {
  .project-case-page .ux-audit-hero-hero.project-case-hero-shell {
    width:100%;
    padding:96px 14px 34px;
    border-radius:0 0 34px 34px;
  }
  .project-case-page .project-case-hero { gap:28px; }
  .project-case-page .project-case-hero h1,
  .project-case-page .project-case-hero h2 {
    font-size:clamp(2.35rem,11vw,3.2rem);
    line-height:1;
  }
  .project-case-page .project-case-hero__copy > p:not(.project-case-kicker):not(.case-hero__eyebrow2) {
    font-size:1.02rem;
    line-height:1.58;
  }
  .project-case-page .project-case-hero > .hero-image { padding:8px; border-radius:24px; }
  .project-case-page .project-case-hero > .hero-image img { border-radius:17px; }
  .project-case-page .case-summary { grid-template-columns:minmax(0,1fr); gap:9px; margin-top:28px; }
  .project-case-page .case-summary__item { padding:17px 18px; border-radius:17px; }
  .project-case-page .project-case-content { width:calc(100% - 24px); margin-top:54px; }
  .project-case-page .project-case-section { padding:24px 20px; border-radius:23px; }
  .project-case-page .project-case-section p,
  .project-case-page .project-case-content > p,
  .project-case-page .project-case-section li { font-size:1rem; line-height:1.66; }
  .project-case-page .case-quote { padding:24px 20px; border-radius:22px; }
  .project-case-page .faq-section { width:calc(100% - 24px); margin-bottom:64px; }
}

@media (prefers-reduced-motion:reduce) {
  .project-case-page .project-case-reveal { opacity:1; transform:none; transition:none; }
  .project-case-page .project-case-hero > .hero-image { transform:none!important; }
}