/* Kompozycja strony publicznej. Kolory pochodzą z palety aplikacji w site.css. */
body { isolation:isolate; }
.ambient { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; background:var(--paper); }
.ambient i { position:absolute; inset:-25%; display:block; opacity:.82; }
.ambient i:first-child {
  background:
    radial-gradient(ellipse at 16% 24%,var(--t-diagnostyka),transparent 45%),
    radial-gradient(ellipse at 88% 46%,var(--t-kalendarz),transparent 43%);
}
.ambient i:last-child {
  background:
    radial-gradient(ellipse at 78% 8%,var(--t-odzyskaj),transparent 40%),
    radial-gradient(ellipse at 22% 91%,var(--t-uslugi),transparent 38%);
  opacity:.55;
}
@media(prefers-reduced-motion:no-preference) {
  .ambient i { will-change:transform; animation:dotty-color-flow 4.75s ease-in-out infinite alternate; }
  .ambient i:last-child { animation:dotty-color-return 6.25s ease-in-out infinite alternate; }
  .page-resting .ambient i { animation-play-state:paused; }
  @keyframes dotty-color-flow {
    from { transform:translate3d(-5%,-3%,0) rotate(-8deg) scale(1); }
    to { transform:translate3d(8%,5%,0) rotate(12deg) scale(1.1); }
  }
  @keyframes dotty-color-return {
    from { transform:translate3d(7%,-5%,0) rotate(9deg); }
    to { transform:translate3d(-8%,7%,0) rotate(-14deg); }
  }
}
.site-header { background:rgb(246 248 248 / .94); }
.site-header .wrap,.landing,.site-footer>.wrap { max-width:1600px; }
.site-header .wrap { padding:19px 48px; }
.brand .mark { width:156px; height:65px; }
.site-header .btn-primary {
  background:var(--t-diagnostyka); color:var(--accent-deep);
  border:1px solid rgb(39 93 89 / .1); border-radius:14px; font-weight:600;
  box-shadow:inset 0 1px 0 #ffffff90,0 2px 0 rgb(39 93 89 / .06);
}
.site-header .btn-primary:hover {
  background:var(--t-diagnostyka); color:var(--accent-deep);
  border-color:rgb(39 93 89 / .2); transform:translateY(-1px);
  box-shadow:inset 0 1px 0 #ffffffb3,0 3px 0 rgb(39 93 89 / .08);
}
a:focus-visible,button:focus-visible,input:focus-visible { outline-color:var(--accent); }
.site-footer { background:#edf1f1; color:var(--muted); border-color:var(--line); }
.site-footer .rejestr { color:var(--muted); }
.tile-s[aria-current] { outline-color:var(--accent); }
.ico { color:var(--accent); }

/* Pierwszy ekran: typografia i fotografia, wejścia w pastelowych kaflach. */
.landing { padding:32px 48px 64px; }
.hero-grid {
  display:grid;
  grid-template-columns:1.08fr 1fr;
  grid-template-rows:auto;
  gap:40px;
  align-items:stretch;
}
.copy-tile {
  grid-column:1; grid-row:1;
  background:transparent;
  border-radius:0;
  box-shadow:none;
  padding:26px 0 22px;
  overflow:visible;
}
.copy-tile:before { display:none; }
.copy-tile>.pill {
  display:flex; align-items:center; gap:10px;
  font-size:12px; line-height:1.6; color:var(--muted);
  margin-bottom:40px;
}
.copy-tile>.pill:before {
  content:""; width:7px; height:7px; border-radius:50%;
  flex-shrink:0; background:var(--brand-dot);
  box-shadow:0 0 0 5px rgb(188 78 138 / .08);
}
.copy-tile h1 {
  margin:0 0 27px;
  font-size:clamp(61px,5.5vw,86px);
  font-weight:600; line-height:.99; letter-spacing:-.064em;
  text-wrap:initial;
}
.copy-tile h1 em {
  display:block; color:var(--accent); font-style:normal;
}
.copy-tile h1 small {
  display:block; margin-top:24px; max-width:480px;
  font-size:.45em; line-height:1.2; letter-spacing:-.035em;
  font-weight:500;
}
.copy-tile .lead {
  max-width:460px; font-size:17px; line-height:1.8;
  color:var(--muted); margin:0 0 34px;
}
.hero-actions { display:grid; grid-template-columns:1.1fr 1fr; gap:12px; margin-top:auto; }
.hero-actions .nav-tile {
  grid-column:auto;
  display:flex; flex-direction:row; align-items:center; justify-content:flex-start;
  gap:18px; padding:23px 24px; min-height:106px; border-radius:17px;
}
.hero-actions .nav-tile .ico { width:30px; height:30px; margin:0; flex-shrink:0; }
.hero-actions .nav-tile .ico svg { width:28px; height:28px; }
.hero-actions .nav-tile .t { font-size:24px; letter-spacing:-.7px; }
.hero-actions .nav-tile .d { margin-top:5px; font-size:10px; line-height:1.5; color:var(--muted); }
.hero-actions .nav-tile:after { right:17px; top:17px; width:7px; height:7px; }
.app-link { background:var(--t-diagnostyka)!important; }
.app-link:before { display:none; }
.hero-cta { font-size:11px; color:var(--muted); margin-top:22px; padding:0; }
.hero-cta a { color:var(--accent); }
.beauty-tile {
  grid-column:2; grid-row:1; min-height:680px;
  background:var(--t-kalendarz); border-radius:26px;
  box-shadow:0 4px 0 rgb(23 32 33 / .06);
}
.beauty-tile img { position:absolute; inset:0; object-position:54% 42%; }
.portrait-mosaic {
  position:absolute; display:grid; grid-template-columns:1fr 1fr; gap:5px;
  right:24px; bottom:24px; width:78px; height:78px;
  transform:rotate(-9deg); opacity:.95;
}
.portrait-mosaic i { border-radius:9px; box-shadow:inset 0 1px 1px #fff9,0 2px 6px #17202118; }
.portrait-mosaic i:nth-child(1) { background:var(--t-diagnostyka); }
.portrait-mosaic i:nth-child(2) { background:var(--t-kalendarz); }
.portrait-mosaic i:nth-child(3) { background:var(--t-uslugi); }
.portrait-mosaic i:nth-child(4) { background:var(--t-klientki); }

/* Drugi rytm kompozycji: nauka i odpowiedzialność kosmetologa. */
.science-strip { display:grid; grid-template-columns:1.13fr 1fr; gap:18px; margin-top:30px; }
.claim-tile {
  grid-column:auto; grid-row:auto; min-height:270px;
  background:var(--t-kalendarz); padding:44px 48px;
  justify-content:center;
  box-shadow:inset 0 1px 0 #fff9,0 4px 0 rgb(23 32 33 / .08);
}
.claim { position:relative; z-index:1; max-width:420px; margin:0; font-size:38px; line-height:1.25; letter-spacing:-1.4px; }
.claim-sign { position:absolute; right:-25px; bottom:-49px; width:192px; height:192px; opacity:.15; transform:rotate(-12deg); }
.dna-tile { grid-column:auto; grid-row:auto; min-height:270px; background:var(--t-diagnostyka); }
.dna-tile img { position:absolute; inset:0; object-position:55% 52%; }
.landing>.tiles { gap:18px; margin-top:28px; }
.landing>.tiles .nav-tile { min-height:178px; padding:26px; }
.landing>.tiles .nav-tile .ico { margin-bottom:24px; }
.landing>.tiles .nav-tile .t { font-size:20px; letter-spacing:-.5px; }
.landing>.tiles .nav-tile .d { font-size:11px; color:var(--muted); }

/* Cennik: prawdziwy plakat kongresu, przeniesiona cena i niezmienione warunki. */
.pricing { max-width:1420px; padding-top:30px; }
.pricing .doc-hero { min-height:195px; padding:30px 42px; }
.pricing .doc-hero h1 { font-size:57px; margin-bottom:12px; }
.pricing .doc-art { opacity:.55; }
.pricing .sheet { background:transparent; border:0; box-shadow:none; padding:12px 0 0; }
.pricing .sheet>p:first-child { max-width:1000px; color:var(--muted); margin:0 0 26px; }
.congress-banner {
  display:grid; grid-template-columns:320px 1fr;
  background:#080d15; color:#fff;
  position:relative; overflow:hidden; isolation:isolate;
  border-radius:28px; margin:0 0 46px;
  box-shadow:0 16px 40px -24px #080d1566;
}
.congress-poster { background:#050910; min-height:294px; display:flex; align-items:center; }
.congress-poster img { width:100%; height:100%; object-fit:contain; }
.congress-copy { padding:31px 42px 30px; position:relative; }
.congress-copy:before {
  content:""; position:absolute; inset:0; pointer-events:none; z-index:-1;
  background:radial-gradient(ellipse at 100% 0,rgb(54 130 184 / .2),transparent 65%);
}
.sheet .congress-copy h2 {
  font-size:20px; line-height:1.4; font-weight:500;
  color:#7cc7f5; letter-spacing:-.3px; margin:0 0 12px;
}
.congress-price { font-size:72px; line-height:1.05; font-weight:600; letter-spacing:-3px; margin:0 0 18px; }
.congress-terms { color:#c9d6e4; font-size:13px; line-height:1.8; margin:0; max-width:660px; }
.subscription-table tbody { grid-template-columns:1fr; }
.subscription-table tr {
  display:grid; grid-template-columns:.8fr 1.2fr; column-gap:58px;
  background:var(--t-diagnostyka); padding:32px 38px;
  box-shadow:inset 0 1px 0 #fff9,0 4px 0 rgb(23 32 33 / .08);
}
.subscription-table td:first-child { grid-column:1; grid-row:1; }
.subscription-table td:nth-child(2) { grid-column:1; grid-row:2; margin-bottom:0; font-size:57px; }
.subscription-table td:nth-child(3) { grid-column:2; grid-row:1/3; font-size:15px; line-height:1.8; align-self:center; color:var(--accent-deep); }
.sheet .packages-table { background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 4px 0 rgb(23 32 33 / .05); }
.packages-table thead th { background:var(--t-kalendarz); color:var(--ink); }
.packages-table tbody tr:nth-child(2n) { background:#f6f8f8; }
.sheet .zasady { gap:18px; }
.zasady .d { color:var(--ink); }

@media(min-width:1800px) {
  .hero-grid { gap:58px; }
  .copy-tile { padding:35px 0 24px; }
  .beauty-tile { min-height:750px; }
  .copy-tile h1 { font-size:93px; }
  .copy-tile .lead { font-size:18px; }
}
@media(max-width:1200px) {
  .site-header .wrap,.landing { padding-left:30px; padding-right:30px; }
  .hero-grid { gap:28px; grid-template-columns:1.07fr 1fr; }
  .copy-tile h1 { font-size:clamp(52px,5.9vw,70px); }
  .copy-tile>.pill { margin-bottom:30px; font-size:11px; }
  .copy-tile .lead { font-size:15px; margin-bottom:27px; }
  .hero-actions .nav-tile { padding:20px 16px; gap:10px; min-height:95px; }
  .hero-actions .nav-tile .t { font-size:21px; }
  .hero-actions .nav-tile .ico { width:23px; }
  .hero-actions .nav-tile .d { font-size:9px; }
  .beauty-tile { min-height:600px; }
  .claim-tile { padding:35px; }
  .claim { font-size:32px; max-width:340px; }
  .congress-banner { grid-template-columns:260px 1fr; }
  .congress-copy { padding:28px 30px; }
  .congress-price { font-size:62px; }
}
@media(max-width:760px) {
  .site-header .wrap { padding:11px 20px; }
  .brand .mark { width:119px; height:50px; }
  .landing { padding:20px 18px 40px; }
  .hero-grid { display:flex; flex-direction:column; gap:21px; }
  .copy-tile { padding:8px 4px 0; }
  .copy-tile>.pill { font-size:10px; margin-bottom:27px; gap:9px; }
  .copy-tile h1 { font-size:clamp(45px,10.9vw,76px); line-height:1; letter-spacing:-.06em; margin-bottom:24px; }
  .copy-tile h1 small { margin-top:18px; font-size:.48em; max-width:350px; }
  .copy-tile .lead { font-size:14px; line-height:1.8; margin:0 0 24px; max-width:480px; }
  .hero-actions { gap:10px; }
  .hero-actions .nav-tile { padding:18px 15px; min-height:89px; gap:10px; border-radius:15px; }
  .hero-actions .nav-tile .t { font-size:21px; letter-spacing:-.6px; }
  .hero-actions .app-link .t { font-size:19px; white-space:nowrap; }
  .hero-actions .nav-tile .ico { width:21px; height:24px; }
  .hero-actions .nav-tile .ico svg { width:22px; height:22px; }
  .hero-actions .nav-tile .d { font-size:8px; margin-top:5px; }
  .hero-actions .nav-tile:after { right:13px; top:13px; width:6px; height:6px; }
  .hero-cta { margin-top:18px; font-size:10px; }
  .beauty-tile { min-height:0; aspect-ratio:4/4.4; border-radius:21px; }
  .beauty-tile img { object-position:50% 40%; }
  .portrait-mosaic { width:60px; height:60px; right:18px; bottom:18px; gap:4px; }
  .science-strip { grid-template-columns:1fr; gap:16px; margin-top:20px; }
  .claim-tile { min-height:205px; padding:32px; }
  .claim { font-size:31px; max-width:300px; letter-spacing:-1.1px; }
  .claim-sign { width:154px; height:154px; bottom:-45px; }
  .dna-tile { min-height:240px; }
  .landing>.tiles { gap:12px; margin-top:20px; }
  .landing>.tiles .nav-tile { min-height:176px; padding:22px 18px; }
  .landing>.tiles .nav-tile .ico { margin-bottom:24px; }
  .landing>.tiles .nav-tile .t { font-size:18px; }
  .landing>.tiles .nav-tile .d { font-size:10px; }
  .pricing .doc-hero { min-height:185px; padding:27px; }
  .pricing .doc-hero h1 { font-size:42px; }
  .pricing .sheet { padding-top:6px; }
  .pricing .sheet>p:first-child { font-size:13px; }
  .congress-banner { grid-template-columns:1fr; border-radius:22px; margin-bottom:34px; }
  .congress-poster { min-height:0; height:166px; padding:7px; }
  .congress-copy { padding:22px 25px 28px; }
  .sheet .congress-copy h2 { font-size:17px; margin-bottom:13px; }
  .congress-price { font-size:57px; letter-spacing:-2px; margin-bottom:16px; }
  .congress-terms { font-size:12px; }
  .subscription-table tr { display:flex; padding:27px; }
  .subscription-table td:nth-child(2) { font-size:48px; margin-bottom:22px; }
  .subscription-table td:nth-child(3) { font-size:13px; }
  .sheet .zasady { gap:14px; }
}
@media(max-width:360px) {
  .hero-actions .nav-tile .ico { display:none; }
  .hero-actions .nav-tile .t { font-size:20px; }
  .copy-tile h1 { font-size:42px; }
  .claim { font-size:27px; }
  .landing>.tiles .nav-tile .t { font-size:16px; }
  .congress-price { font-size:49px; }
}
@media print {
  .ambient { display:none; }
  .pricing .sheet { padding:0; }
  .congress-banner { background:#fff; color:#000; border:1px solid #aaa; box-shadow:none; margin:16px 0; border-radius:0; display:block; break-inside:avoid; }
  .congress-poster { display:none; }
  .congress-copy { padding:18px; }
  .sheet .congress-copy h2,.congress-terms { color:#000; }
  .congress-price { font-size:28pt; }
  .congress-copy:before { display:none; }
}