/* ==========================================================
   Směr A — Cesta do podloží 2.0
   Paleta Měď & antracit (stejná jako ostrý web) + dotažená typografie.
   ========================================================== */

:root {
    --font-display: 'Barlow Condensed';
    --font-body: 'Inter';
    --font-tech: 'IBM Plex Mono';
}

/* Nadpisy kondenzovaným řezem — víc úderu, míň místa */
h1, h2, h3, h4,
.pl-depth, #pl-pct, .pl-pctsym {
    font-family: var(--font-display), 'Arial Narrow', system-ui, sans-serif;
    letter-spacing: -0.005em;
}

h1 { letter-spacing: -0.02em; line-height: 0.94; }
h2 { line-height: 0.98; }

/* Technické popisky monem */
.font-mono, .depth-readout, .depth-tick::after {
    font-family: var(--font-tech), ui-monospace, Menlo, monospace;
}

/* Kondenzovaný řez unese větší stupeň — hero dostane víc síly */
@media (min-width: 768px) {
    h1.text-5xl { font-size: 5.5rem; }
}
@media (min-width: 1024px) {
    h1.text-5xl { font-size: 7.5rem; }
}

/* Jemné dotažení: měděná linka pod aktivní kartou služby */
#sluzby .hard-shadow-hover { position: relative; }
#sluzby .hard-shadow-hover::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 3px;
    background: var(--copper);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
}
#sluzby .hard-shadow-hover:hover::after { transform: scaleX(1); }

/* Klidnější zrno vrstev, ať nekonkuruje fotkám */
.strata::before { opacity: 0.38; }

@media (prefers-reduced-motion: reduce) {
    #sluzby .hard-shadow-hover::after { transition: none; }
}

/* ==========================================================
   TVAROSLOVÍ — OCELOVÁ DESKA
   Nulový rádius, dvojitý „registrační" rám, tvrdý offsetový stín.
   Prvek působí jako přivařený plát, ne jako karta v aplikaci.
   ========================================================== */

/* Nikde žádné zaoblení — ani na vstupech a tlačítkách */
.project-card-wrapper article,
a[class*="bg-copper"], button[class*="bg-copper"],
.filter-btn, input, textarea, select { border-radius: 0; }

/* Dvojitý rám: vnitřní plát + odsazená vlasová linka okolo */
.project-card-wrapper article {
    outline: 1px solid rgb(var(--c-copper) / 0.32);
    outline-offset: 6px;
    transition: outline-color 0.25s ease, outline-offset 0.25s ease;
}
.project-card-wrapper article:hover {
    outline-color: rgb(var(--c-copper));
    outline-offset: 3px;
}

/* Vstupy formuláře: razítková spodní hrana */
input, textarea {
    border-width: 1px 1px 3px 1px;
    border-bottom-color: rgb(var(--c-copper-dark));
}
input:focus, textarea:focus { border-bottom-color: rgb(var(--c-copper)); }

/* Oddělovače: krátký těžký segment místo tenké linky přes celou šířku */
#sluzby .border-b-2 { border-bottom-width: 3px; }

@media (prefers-reduced-motion: reduce) {
    .project-card-wrapper article { transition: none; }
}

/* Vstupy: třídy z Tailwindu (border-2, rounded-none) mají vyšší specificitu
   než element selektor — proto cílíme přes id formuláře. */
#contact-form input, #contact-form textarea {
    border-radius: 0;
    border-width: 1px 1px 3px 1px;
    border-bottom-color: rgb(var(--c-copper-dark));
}
#contact-form input:focus, #contact-form textarea:focus { border-bottom-color: rgb(var(--c-copper)); }