
:root{--ink:#242923;--muted:#777a72;--cream:#f5f3ed;--sand:#e7e4dc;--accent:#a2a88d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.wrap{max-width:1260px;margin:auto;padding:0 6%}.demo{background:#29352c;color:#fff;text-align:center;font-size:11px;letter-spacing:.1em;padding:9px}header{height:84px;display:flex;align-items:center;justify-content:space-between}.logo{font-size:27px;font-weight:800;letter-spacing:.19em}nav{display:flex;gap:32px;align-items:center;font-size:12px;text-transform:uppercase;letter-spacing:.12em}.btn{display:inline-block;background:var(--ink);color:#fff;padding:17px 23px;font-size:11px;text-transform:uppercase;letter-spacing:.15em;border:1px solid var(--ink);cursor:pointer}.btn:hover{background:#485346}.menu{display:none;background:none;border:0;font-size:24px;cursor:pointer}.hero{display:grid;grid-template-columns:44% 56%;min-height:590px}.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:45px 9% 65px 11%}.eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#777c70}.hero h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(48px,5.8vw,90px);line-height:1.05;letter-spacing:-.05em;margin:25px 0}.hero p{max-width:360px;color:#656b61;line-height:1.85;font-size:15px;margin:0 0 32px}.hero-photo{min-height:540px;background:linear-gradient(135deg,#c3c3b7,#777e6f);position:relative;overflow:hidden}.hero-photo img,.project img{width:100%;height:100%;object-fit:cover;display:block}.hero-photo .credit{position:absolute;bottom:15px;right:20px;color:white;font-size:11px;text-shadow:0 1px 4px #000}.section{padding:110px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:48px}.section h2{font-family:Georgia,serif;font-size:clamp(35px,4vw,60px);font-weight:400;letter-spacing:-.04em;line-height:1.12;margin:14px 0}.section-desc{color:#666c63;line-height:1.8;max-width:450px;font-size:15px}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#c9cbc2;border-top:1px solid #c9cbc2;border-bottom:1px solid #c9cbc2}.service{background:var(--cream);padding:35px 28px 40px}.service .num{font-size:11px;color:#7e8276}.service h3{font-family:Georgia,serif;font-size:27px;font-weight:400;margin:40px 0 16px}.service p{font-size:14px;color:#6b7168;line-height:1.8}.projects{background:#eae8e1}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.project{margin:0}.project-image{height:350px;background:#b8b9af;overflow:hidden}.project figcaption{display:flex;justify-content:space-between;padding:19px 0;font-size:14px}.project small{color:#797e74}.about{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.about-visual{height:400px;background:#c6c8b8;display:flex;align-items:center;justify-content:center;font-family:Georgia,serif;font-size:110px;color:#f4f3ec;letter-spacing:-.1em}.contact{background:#29352c;color:white}.contact .eyebrow,.contact p{color:#c3c9be}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.contact h2{max-width:500px}form{display:grid;gap:13px}input,textarea{width:100%;padding:16px;border:1px solid #a3aa9e;background:#fff;color:#222;border-radius:0}textarea{min-height:110px;resize:vertical}form .btn{background:#e7e9df;color:#26332a;border-color:#e7e9df}footer{background:#202a22;color:#aeb5aa;padding:25px 0;font-size:12px}.footer-inner{display:flex;justify-content:space-between;gap:20px}.note{font-size:12px;color:#c4cabf;line-height:1.6}@media(max-width:760px){header{height:70px}.menu{display:block}nav{display:none;position:absolute;top:104px;left:0;right:0;background:var(--cream);z-index:10;padding:25px 6%;flex-direction:column;align-items:start;box-shadow:0 10px 20px #0001}nav.open{display:flex}.hero{grid-template-columns:1fr}.hero-copy{padding:70px 6%}.hero-photo{min-height:360px;height:55vh}.section{padding:70px 0}.section-head{display:block}.services,.project-grid,.about,.contact-grid{grid-template-columns:1fr}.service h3{margin-top:20px}.project-image{height:300px}.about{gap:30px}.about-visual{height:270px}.footer-inner{flex-direction:column}}

/* Lekce 2: jednotné bezpečné okraje na mobilu i desktopu */
:root { --page-gutter: clamp(24px, 5vw, 76px); }
.wrap { width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: var(--page-gutter); }
.hero-copy { padding-left: var(--page-gutter); padding-right: var(--page-gutter); }
nav { padding-inline: 0; }
.service { min-width: 0; }
.project figcaption { gap: 12px; flex-wrap: wrap; }
@media (max-width: 760px) {
  :root { --page-gutter: 26px; }
  .hero-copy { padding: 64px var(--page-gutter) 66px; }
  nav { left: 0; right: 0; padding: 25px var(--page-gutter); }
  .section { padding-block: 72px; }
  .service { padding: 30px 24px 36px; }
  .section h2 { overflow-wrap: break-word; }
  .footer-inner { gap: 12px; }
}
@media (max-width: 360px) {
  :root { --page-gutter: 22px; }
  .hero h1 { font-size: 46px; }
  .section h2 { font-size: 34px; }
}

/* Vícestránkový projekt */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #7e9570;outline-offset:4px}
.project-link{display:block}.project-link:hover img{transform:scale(1.035)}.project-image img{transition:transform .35s ease}.project-link:hover figcaption span{text-decoration:underline;text-underline-offset:4px}.page-intro{padding:85px 0 65px}.page-intro h1{font-family:Georgia,serif;font-size:clamp(50px,7vw,105px);font-weight:400;letter-spacing:-.055em;line-height:1.05;margin:20px 0}.page-intro p{max-width:600px;color:#666c63;line-height:1.85}.gallery{padding:0 0 105px}.gallery .project-grid{gap:36px 24px}.gallery .project-image{height:400px}.backlink{display:inline-block;margin-top:24px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;border-bottom:1px solid currentColor;padding-bottom:7px}.gallery-note{background:#eae8e1;padding:22px 26px;margin-bottom:38px;color:#555f52;line-height:1.65;font-size:14px}.nav-current{border-bottom:1px solid currentColor;padding-bottom:5px}
@media(max-width:760px){.page-intro{padding:60px 0 40px}.gallery{padding-bottom:65px}.gallery .project-image{height:310px}.gallery .project-grid{gap:18px}.nav-current{border-bottom:0;font-weight:bold}}

/* Verze 3: konzistentní okraje a bezpečná responzivita */
html,body{width:100%;max-width:100%;overflow-x:clip}
:root{--page-gutter:clamp(24px,5vw,76px)}
.wrap{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--page-gutter)}
main,section,header,footer,.project-grid,.services,.section-head,.about,.contact-grid{min-width:0}
img{max-width:100%}
.section-head>*{min-width:0}
.hero-copy{min-width:0}
.project figcaption{min-width:0}
.detail-description{display:grid;grid-template-columns:1fr 1.3fr;gap:24px 70px;align-items:start;margin:20px 0 48px}
.detail-description .eyebrow{grid-column:1/-1}
.detail-description h2{font:400 clamp(30px,3.6vw,52px)/1.12 Georgia,serif;letter-spacing:-.04em;margin:0}
.detail-description p{font-size:15px;line-height:1.9;color:#666c63;margin:0;max-width:520px}
.detail-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:28px}
.detail-photo{margin:0;min-width:0;background:#d6d5cc;overflow:hidden;aspect-ratio:4/3}
.detail-photo:first-child,.detail-photo:last-child{grid-column:1/-1;aspect-ratio:16/9}
.detail-photo img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:760px){
 :root{--page-gutter:28px}
 .wrap{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
 .hero-copy{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
 .hero-photo{width:100%;min-width:0}
 .section-head,.project-grid,.services,.about,.contact-grid{width:100%;min-width:0}
 .section h2,.page-intro h1,.hero h1{overflow-wrap:normal;word-break:normal}
 .detail-description{grid-template-columns:1fr;gap:16px;margin-bottom:32px}
 .detail-gallery{grid-template-columns:1fr;gap:14px}
 .detail-photo,.detail-photo:first-child,.detail-photo:last-child{grid-column:auto;aspect-ratio:4/3}
 .detail-photo:first-child{aspect-ratio:5/4}
 .project-image{max-width:100%}
}
@media(max-width:380px){:root{--page-gutter:24px}.hero h1{font-size:clamp(38px,11vw,46px)}.page-intro h1{font-size:clamp(39px,11vw,50px)}}

/* FORMA 3.1: tri vybrane projekty na uvodni strance */
@media(min-width:761px){.projects .project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.projects .project-image{height:auto;aspect-ratio:4/5}}
@media(max-width:760px){.projects .project-grid{grid-template-columns:1fr}}

/* FORMA 3.2 — společný horizontální rastr pro hlavičku, hero i sekce */
:root { --content-max: 1440px; --page-gutter: clamp(24px, 5vw, 76px); }
.wrap { max-width: var(--content-max); margin-inline: auto; padding-inline: var(--page-gutter); }
.hero {
  width: 100%; max-width: var(--content-max); margin-inline: auto;
  padding-inline: var(--page-gutter);
  grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
  gap: clamp(28px, 3.5vw, 54px);
  align-items: stretch;
}
.hero-copy { padding: 55px 0 65px; min-width: 0; }
.hero h1 { font-size: clamp(48px, 5.3vw, 82px); overflow-wrap: normal; }
.hero-photo { min-width: 0; }
@media (min-width: 761px) and (max-width: 1050px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; min-height: 480px; }
  .hero-copy { padding-block: 42px; }
  .hero h1 { font-size: clamp(42px, 5.1vw, 62px); }
  .hero-photo { min-height: 450px; }
}
@media (max-width: 760px) {
  :root { --page-gutter: 28px; }
  .hero { grid-template-columns: minmax(0, 1fr); gap: 0; min-height: 0; }
  .hero-copy { padding: 64px 0 54px; }
  .hero-photo { width: 100%; min-height: 330px; height: 52vh; }
}
@media (max-width: 380px) { :root { --page-gutter: 24px; } }


/* FORMA 3.3 — restrained motion and business contact */
@keyframes formaRise { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes formaFade { from { opacity:0; } to { opacity:1; } }
@keyframes formaReveal { from { opacity:0; clip-path:inset(0 0 100% 0); } to { opacity:1; clip-path:inset(0 0 0 0); } }
@keyframes formaZoom { from { transform:scale(1.065); } to { transform:scale(1); } }
.animate-load.anim-rise { animation:formaRise .95s cubic-bezier(.2,.75,.2,1) both; animation-delay:var(--delay,0s); }
.animate-load.anim-fade { animation:formaFade .85s ease-out both; }
.animate-load.anim-reveal { animation:formaReveal 1.3s cubic-bezier(.2,.75,.2,1) both; animation-delay:.2s; }
.hero-zoom { animation:formaZoom 1.8s ease-out both; }
.scroll-reveal { transition:opacity .8s ease, transform .8s cubic-bezier(.2,.75,.2,1); }
@media (prefers-reduced-motion: no-preference) {
  .scroll-reveal:not(.is-visible) { opacity:1; transform:none; }
  .scroll-reveal.is-visible { animation:formaRise .8s ease both; animation-delay:var(--stagger,0s); }
}
.btn, .social-icon { transition:background-color .25s ease, color .25s ease, transform .25s ease; }
.btn:hover { transform:translateY(-2px); }
.project-image img { transition:transform .6s ease; }
.project:hover .project-image img { transform:scale(1.035); }
.contact-grid { align-items:start; }
.studio-details { margin-top:38px; padding-top:24px; border-top:1px solid #738075; max-width:470px; display:grid; gap:19px; }
.contact-caption { font-size:10px; letter-spacing:.16em; color:#c3c9be; }
.studio-details > div:not(.social-line) { display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; align-items:baseline; }
.studio-details span { color:#c3c9be; font-size:13px; }
.studio-details strong { font-size:14px; font-weight:400; overflow-wrap:anywhere; }
.social-line { display:grid; gap:12px; }
.social-icons { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.social-icon { width:37px; height:37px; border:1px solid #859286; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; color:#f5f3ed; }
.social-icon svg { width:18px; height:18px; }
.social-icons small { font-size:11px; color:#c3c9be; }
.field { display:grid; gap:7px; }
.field > span { font-size:12px; color:#d5dacf; letter-spacing:.03em; }
.contact input, .contact textarea { min-width:0; }
@media (max-width:760px) { .studio-details { margin-bottom:28px; } .studio-details > div:not(.social-line) { grid-template-columns:90px minmax(0,1fr); } }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .scroll-reveal,.animate-load { opacity:1!important; transform:none!important; clip-path:none!important; }
}


/* FORMA 3.4 — align philosophy copy with hero photograph */
@media (min-width: 761px) {
  #o-nas .section-head {
    display: grid;
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
    column-gap: clamp(28px, 3.5vw, 54px);
    align-items: center;
  }
  #o-nas .section-desc {
    width: 100%;
    max-width: 450px;
    margin: 0;
    justify-self: start;
  }
}
/* Delicate individual navigation hover, applied on every page */
header nav a {
  display: inline-block;
  position: relative;
  transform-origin: center;
  transition: transform .26s cubic-bezier(.2,.75,.2,1), color .26s ease;
}
header nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -7px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s ease;
}
@media (hover: hover) and (pointer: fine) {
  header nav a:hover, header nav a:focus-visible {
    transform: translateY(-2px) scale(1.045);
    color: #697762;
  }
  header nav a:hover::after, header nav a:focus-visible::after {
    transform: scaleX(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  header nav a, header nav a::after { transition: none !important; }
  header nav a:hover, header nav a:focus-visible { transform: none; }
}

/* FORMA 4.0 — editorial secondary pages */
html{scroll-behavior:smooth}#kontakt{scroll-margin-top:20px}.text-link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:5px;font-size:13px;letter-spacing:.02em;color:inherit}.text-link:hover{opacity:.65}.section-head>.text-link{align-self:end;margin-top:20px}.editorial-hero{position:relative;margin-top:20px}.editorial-hero img{width:100%;height:min(55vw,520px);min-height:290px;object-fit:cover;filter:saturate(.7)}.photo-label{position:absolute;right:15px;bottom:15px;background:#f4f1e8;padding:8px 12px;font-size:10px;letter-spacing:.08em}.editorial-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(35px,7vw,120px);align-items:start}.editorial-split p{font-size:17px;line-height:1.85;max-width:540px;margin:0 0 22px}.about-band{background:#e8e8df;padding:90px 0}.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:40px}.team-card img{width:100%;height:clamp(230px,29vw,390px);object-fit:cover;filter:saturate(.6)}.team-card h3{font-size:25px;font-weight:400;margin:13px 0 8px}.team-card p{max-width:390px;font-size:14px;line-height:1.7}.team-card .eyebrow{display:block;margin-top:22px}.service-feature{display:grid;grid-template-columns:1.07fr .93fr;gap:clamp(30px,7vw,115px);align-items:center;border-top:1px solid #d6d7cd}.service-feature:nth-of-type(odd) .service-feature-photo{order:2}.service-feature-photo img{width:100%;height:clamp(290px,37vw,540px);object-fit:cover}.service-feature-copy h2{font-size:clamp(32px,4vw,58px);line-height:1.12;margin:20px 0}.service-feature-copy p{max-width:440px;font-size:16px;line-height:1.8}.feature-line{font-size:12px;line-height:1.8;letter-spacing:.02em;border-top:1px solid #c9cec4;border-bottom:1px solid #c9cec4;padding:18px 0;margin:28px 0}.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:55px}.process-grid>div{border-top:1px solid #a8afa5;padding-top:20px}.process-grid span{font-size:12px}.process-grid h3{font-size:24px;font-weight:400}.process-grid p{font-size:14px;line-height:1.7}.expanded-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:45px 24px}.expanded-grid .project{grid-column:span 2}.expanded-grid .project:nth-child(4),.expanded-grid .project:nth-child(5){grid-column:span 3}.expanded-grid .project:nth-child(4) .project-image,.expanded-grid .project:nth-child(5) .project-image{aspect-ratio:1.35}.expanded-grid .project-image img{width:100%;height:100%;object-fit:cover}.detail-gallery-six{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}.detail-gallery-six .detail-photo{grid-column:span 3;margin:0;min-width:0}.detail-gallery-six .detail-photo:nth-child(3){grid-column:span 6}.detail-gallery-six .detail-photo:nth-child(n+4){grid-column:span 2}.detail-gallery-six .detail-photo img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:1.28}.detail-gallery-six .detail-photo:nth-child(3) img{aspect-ratio:2.3}.detail-gallery-six .detail-photo:nth-child(n+4) img{aspect-ratio:.85}.project-bottom-nav{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:35px 0 0}.contact .btn{cursor:pointer}
@media(max-width:760px){.editorial-split,.team-grid,.service-feature{grid-template-columns:1fr}.service-feature:nth-of-type(odd) .service-feature-photo{order:0}.service-feature-photo img{height:340px}.about-band{padding:65px 0}.process-grid{grid-template-columns:1fr;gap:15px}.expanded-grid{grid-template-columns:1fr 1fr;gap:30px 16px}.expanded-grid .project,.expanded-grid .project:nth-child(4),.expanded-grid .project:nth-child(5){grid-column:span 1}.expanded-grid .project:last-child{grid-column:span 2}.expanded-grid .project:nth-child(4) .project-image,.expanded-grid .project:nth-child(5) .project-image{aspect-ratio:unset}.detail-gallery-six{gap:12px}.detail-gallery-six .detail-photo:nth-child(n+4){grid-column:span 3}.detail-gallery-six .detail-photo:nth-child(6){grid-column:span 6}.detail-gallery-six .detail-photo:nth-child(n+4) img{aspect-ratio:1.2}.editorial-hero img{height:360px}}
@media(max-width:480px){.expanded-grid{grid-template-columns:1fr}.expanded-grid .project,.expanded-grid .project:last-child{grid-column:span 1}.expanded-grid .project-image{aspect-ratio:1.25}.detail-gallery-six{grid-template-columns:1fr}.detail-gallery-six .detail-photo,.detail-gallery-six .detail-photo:nth-child(3),.detail-gallery-six .detail-photo:nth-child(n+4),.detail-gallery-six .detail-photo:nth-child(6){grid-column:span 1}.detail-gallery-six .detail-photo img,.detail-gallery-six .detail-photo:nth-child(3) img,.detail-gallery-six .detail-photo:nth-child(n+4) img{aspect-ratio:1.3}.project-bottom-nav{flex-wrap:wrap}}

/* FORMA 4.1 — sticky navigation, consistent page entrances, six-project grid */
.sticky-header-shell{position:sticky;top:0;z-index:100;background:rgba(245,243,237,.95);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(36,41,35,.10)}
.sticky-header-shell header{position:relative}
#kontakt{scroll-margin-top:105px}
header nav a.animate-load.anim-fade{animation-delay:var(--delay,0s)}
.intro-rule{height:1px;width:clamp(65px,12vw,155px);background:#879185;margin:4px 0 23px;transform-origin:left;animation:formaRule 1s ease both;animation-delay:.28s}
@keyframes formaRule{from{opacity:0;transform:scaleX(.15)}to{opacity:1;transform:scaleX(1)}}
.back-to-top{position:fixed;right:clamp(16px,3vw,38px);bottom:clamp(18px,3vw,36px);width:47px;height:47px;border-radius:50%;border:1px solid #a6afa3;background:#29352c;color:#fff;font-size:24px;line-height:1;display:grid;place-items:center;z-index:150;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .3s ease,transform .3s ease,visibility .3s ease,background .25s ease;box-shadow:0 5px 20px #0002}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:#4d614f}.back-to-top:focus-visible{outline:2px solid #8c9c8d;outline-offset:3px}
.expanded-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 24px}
.expanded-grid .project,.expanded-grid .project:nth-child(4),.expanded-grid .project:nth-child(5),.expanded-grid .project:nth-child(6){grid-column:auto}
.expanded-grid .project-image,.expanded-grid .project:nth-child(4) .project-image,.expanded-grid .project:nth-child(5) .project-image{height:auto;aspect-ratio:1.04}
@media(max-width:900px){.expanded-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.sticky-header-shell nav{position:absolute;top:100%;left:0;right:0}.expanded-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.expanded-grid .project:last-child{grid-column:auto}.back-to-top{width:43px;height:43px}}
@media(max-width:480px){.expanded-grid{grid-template-columns:1fr}.expanded-grid .project,.expanded-grid .project:last-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.intro-rule{animation:none}.back-to-top{transition:none}}

/* FORMA 4.2 — airy hero, subtle social hover, no service section dividers */
.service-feature{border-top:0}
.social-icon{transition:background-color .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;cursor:default}
.social-icon:hover{background:#e7e9df;color:#29352c;border-color:#e7e9df;transform:translateY(-3px)}
/* The homepage image begins at the eyebrow level rather than directly below navigation. */
@media(min-width:761px){
  .hero{align-items:start}
  .hero-copy{justify-content:flex-start;padding-top:55px}
  .hero-photo{margin-top:55px;min-height:490px}
}
@media(prefers-reduced-motion:reduce){.social-icon{transition:none}.social-icon:hover{transform:none}}

/* FORMA 5.0 — consistent final interactions and layout corrections */
/* Homepage service columns: only internal separators, no outer vertical edges. */
.services{background:transparent;gap:0}
.service:not(:last-child){border-right:1px solid #c9cbc2}
/* Hide the thin edge of the hero image without moving or resizing its container. */
.hero-photo img{width:calc(100% + 2px);max-width:none;object-position:center center}
/* Underlined text links: fade only, never rise on hover. */
.text-link,.backlink{transition:color .25s ease,opacity .25s ease,border-color .25s ease}
.text-link:hover,.backlink:hover{opacity:.65;transform:none}
/* Project navigation shares a baseline despite different link styles. */
.project-bottom-nav{align-items:baseline}
.project-bottom-nav .backlink,.project-bottom-nav .text-link{margin-top:0;padding-bottom:7px;line-height:1.5}
/* Team cards use the same entrance timing, not index-dependent stagger. */
.team-card.scroll-reveal.is-visible{animation-delay:0s}
/* Process cards enter together with identical timing. */
.process-grid>.scroll-reveal.is-visible{animation-delay:0s}
/* Buttons stay raised on hover; do not combine animation-fill-mode with hover transform. */
.btn:hover{transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.btn:hover{transform:none}}

/* FORMA 5.1 — final QA corrections (4 Nov 2026) */
/* The entrance animation owns opacity, so use a color change for this link's hover. */
.studio-link:hover,.studio-link:focus-visible{color:#7b8577;border-bottom-color:#7b8577}
/* Back links on project details animate once on arrival/scroll, not on hover. */
.page-intro .backlink.animate-load.anim-rise{animation-duration:.8s}
.project-bottom-nav .backlink.scroll-reveal.is-visible{animation-duration:.8s}

/* FORMA 5.2 — restore hover feedback on all twelve animated project back-links.
   Entrance animations control opacity and transform; hover uses color instead,
   so animation-fill-mode cannot suppress the hover feedback. */
.page-intro .backlink.animate-load:hover,
.page-intro .backlink.animate-load:focus-visible,
.project-bottom-nav .backlink.scroll-reveal:hover,
.project-bottom-nav .backlink.scroll-reveal:focus-visible {
  color: #7b8577;
  border-bottom-color: #7b8577;
}


/* FORMA 5.3 — both footer navigation links enter together on all project pages.
   Hover uses a color change; the entrance animation keeps its transform. */
.project-bottom-nav .scroll-reveal.is-visible {
  animation-delay: 0s;
  animation-duration: .8s;
}
.project-bottom-nav .text-link.scroll-reveal:hover,
.project-bottom-nav .text-link.scroll-reveal:focus-visible {
  color: #7b8577;
  border-bottom-color: #7b8577;
}

/* FORMA 5.4 — homepage services: mobile-only horizontal separators.
   Desktop three-column framing remains unchanged. */
@media (max-width: 760px) {
  .services {
    border-top: 0;
    border-bottom: 0;
    background: transparent;
    gap: 0;
  }
  .services > .service {
    border: 0;
  }
  .services > .service + .service {
    border-top: 1px solid #c9cbc2;
  }
}

/* FORMA 5.5 — tablet / landscape hero photo: fill the photo container.
   Limited to 761–1050px; desktop and portrait mobile are unchanged. */
@media (min-width: 761px) and (max-width: 1050px) {
  .hero-photo { position: relative; overflow: hidden; }
  .hero-photo > img {
    position: absolute;
    inset: 0;
    width: calc(100% + 2px);
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center center;
  }
}

/* FORMA 5.6 — accessibility refinements; layout and animations unchanged */
.eyebrow { color:#62685e; }
.service .num { color:#62685e; }
.form-feedback:not([hidden]) { display:block; margin:3px 0 0; padding:12px 14px; border:1px solid #b8c4b3; color:#f5f3ed; font-size:13px; line-height:1.6; }

/* FORMA 5.7 — targeted WCAG AA contrast improvements; no layout changes. */
.section-desc { color: #555b52; }
.project small { color: #555b52; }
.about-visual { color: #4d5549; }


/* FORMA 5.8 — trvalé označení aktuální stránky v navigaci */
header nav a[aria-current="page"] {
  color: #697762;
  transform: none;
}
header nav a[aria-current="page"]::after {
  transform: scaleX(1);
}
@media (hover: hover) and (pointer: fine) {
  header nav a[aria-current="page"]:hover {
    transform: translateY(-2px) scale(1.045);
  }
}
