/* NL CLINIC — gałąź ginekologii estetycznej.
   Odrębna paleta i odrębny ruch dla tej gałęzi (decyzja właścicielki 2026-08-15):
   kość słoniowa jak w reszcie serwisu, róż zamiast złota jako akcent, pas nagłówka pudrowy #EAD7DA zamiast bordowego (wariant 3c, wybór właścicielki 2026-08-15).
   Typografia i geometria bez zmian: Cormorant Garamond, Alegreya Sans, promień 0,
   przyciski pigułki. Arkusz trzyma to, czego nie da się zapisać stylem lokalnym:
   ruch, stany interakcji, wyłączenie ruchu przy prefers-reduced-motion.

   Kontrasty na tle #FBF9F5: tekst #1C1A19 15,8:1, róż tekstowy #9B3357 6,6:1,
   tekst drugorzędny #6B6259 5,4:1. Na pasie #EAD7DA tekst #2C2124 daje 11,4:1. Róż ornamentalny #C98BA0 wyłącznie na linie
   i obramowania, nigdy pod tekst. */

:root{
  --g-ease:cubic-bezier(0.23,1,0.32,1);
  --g-czas-odslona:640ms;
  --g-czas-ui:200ms;
  --g-czas-linia:700ms;
  --g-kaskada:70ms;
  --g-dystans:12px;
}

/* --- Odsłona: krótsza droga i szybsza kaskada niż w sekcji instytucjonalnej.
       Stan początkowy nakłada skrypt, nie arkusz. --- */
.g-ruch-start{ opacity:0; transform:translateY(var(--g-dystans)); }
.g-ruch-in{
  opacity:1; transform:none;
  transition:opacity var(--g-czas-odslona) var(--g-ease),
             transform var(--g-czas-odslona) var(--g-ease);
}

/* --- Linia pod nagłówkiem: różowa, rysowana od lewej. --- */
.g-linia{ display:block; height:1px; background:#C98BA0; transform-origin:left center; }
.g-linia.g-ruch-start{ opacity:1; transform:scaleX(0); }
.g-linia.g-ruch-in{
  transform:scaleX(1);
  transition:transform var(--g-czas-linia) var(--g-ease) 120ms;
}

/* --- Karty zabiegów: bez uniesienia i bez cienia, sama krawędź i tło. --- */
.g-karta{ transition:border-color var(--g-czas-ui) var(--g-ease), background-color var(--g-czas-ui) var(--g-ease); }
@media (hover:hover){
  .g-karta:hover{ border-color:#C98BA0; background-color:#FDFBF8; }
}
.g-karta:focus-within{ border-color:#9B3357; }

/* --- Przycisk: geometria systemowa, paleta gałęzi. Łuk rusza tylko na hover
       i focus, zgodnie z odstępstwem zatwierdzonym 2026-08-10. --- */
@keyframes g-obieg{ to{ rotate:360deg; } }
.g-btn{
  --tlo:#7C2646; --tlo-hover:#5E1B34; --tekst:#fff;
  --ring:rgba(227,182,196,.85); --ring-hover:rgba(201,139,160,.32);
  --luk:#E3B6C4; --luk-grubosc:1.5px; --obieg-czas:1.6s;
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  gap:12px; padding:17px 38px; min-height:52px; border:0; cursor:pointer; isolation:isolate;
  background:var(--tlo); color:var(--tekst); border-radius:100px;
  font-family:inherit; font-size:.95rem; font-weight:500; letter-spacing:.015em;
  text-decoration:none; overflow:hidden;
  transition:background-color 380ms var(--g-ease), color 380ms var(--g-ease),
             box-shadow 380ms var(--g-ease), transform 160ms var(--g-ease);
}
.g-btn::after{
  content:''; position:absolute; inset:5px; border:1px solid var(--ring);
  border-radius:100px; pointer-events:none; z-index:2;
  transition:border-color 380ms var(--g-ease);
}
.g-btn::before{
  content:''; position:absolute; inset:5px; border-radius:100px; z-index:1; opacity:0;
  background:conic-gradient(from 0deg, transparent 0deg, transparent 296deg, color-mix(in srgb, var(--luk) 45%, transparent) 322deg, var(--luk) 348deg, transparent 360deg);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - var(--luk-grubosc)), #000 calc(100% - var(--luk-grubosc)));
          mask:radial-gradient(farthest-side, transparent calc(100% - var(--luk-grubosc)), #000 calc(100% - var(--luk-grubosc)));
  transition:opacity 220ms var(--g-ease);
}
.g-btn:focus-visible{ outline:2px solid #9B3357; outline-offset:3px; }
.g-btn:hover, .g-btn:focus-visible{ background-color:var(--tlo-hover); }
.g-btn:hover::before, .g-btn:focus-visible::before{ opacity:1; animation:g-obieg var(--obieg-czas) linear infinite; }
.g-btn:hover::after, .g-btn:focus-visible::after{ border-color:var(--ring-hover); }
.g-btn:active{ transform:scale(.97); }
.g-btn--jasny{
  /* tokeny zamiast literałów, żeby przycisk konturowy adaptował się do trybu ciemnego */
  --tlo:transparent; --tlo-hover:var(--nl-tlo-2); --tekst:var(--nl-tekst);
  --ring:#C98BA0; --ring-hover:rgba(201,139,160,.42); --luk:#7C2646;
  box-shadow:inset 0 0 0 1px var(--nl-linia);
}
.g-btn--jasny:hover, .g-btn--jasny:focus-visible{ color:var(--nl-gin-ciemny); box-shadow:inset 0 0 0 1px transparent; }
@supports not (background: color-mix(in srgb, red 50%, transparent)){
  .g-btn::before{ background:conic-gradient(from 0deg, transparent 0deg, transparent 310deg, var(--luk) 348deg, transparent 360deg); }
}

/* --- Osadzenie kalendarza ZnanyLekarz: ładowane dopiero po kliknięciu,
       bo to zewnętrzny skrypt. Bez zgody nic się nie łączy. --- */
.g-widget{ min-height:120px; }
.g-widget iframe{ max-width:100%; border:0; }

@media (prefers-reduced-motion:reduce){
  .g-ruch-start{ opacity:1; transform:none; }
  .g-ruch-in{ transition:none; }
  .g-linia.g-ruch-start{ transform:scaleX(1); }
  .g-linia.g-ruch-in{ transition:none; }
  .g-btn, .g-btn::after, .g-btn::before, .g-karta{
    transition-duration:.01ms !important; animation:none !important;
  }
  .g-btn:hover::before, .g-btn:focus-visible::before{ opacity:0; }
  .g-btn:active{ transform:none; }
}
