/* ============================================================
   Justyna Bucknall-Hołyńska — Psycholog · Gorzów Wielkopolski
   Production stylesheet (self-contained, no build step).
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Lora:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Mulish:wght@300;400;500;600;700&display=swap');

:root {
  /* green */
  --green-900:#0E2E24; --green-800:#143D32; --green-700:#1B4D3E; --green-600:#235A49;
  --green-500:#2E6E5A; --green-200:#A9C7BC; --green-100:#D6E5DE; --green-50:#EDF3EF;
  /* gold */
  --gold-800:#7C5E2E; --gold-700:#97743D; --gold-600:#B0894E; --gold-500:#C2A063;
  --gold-400:#D4BC8A; --gold-300:#E3D2B0; --gold-200:#EFE3C9; --gold-100:#F6EEDC;
  /* cream / neutral */
  --cream-50:#FBF8F1; --cream-100:#F5EFE3; --cream-200:#ECE4D4;
  --ink-900:#16231E; --ink-800:#22312b; --ink-700:#2D3A34; --ink-600:#44524B; --ink-500:#5E6A63; --ink-400:#828D86;

  /* semantic */
  --color-bg:var(--cream-50); --surface-card:#FFFFFF; --surface-alt:var(--cream-100);
  --surface-deep:var(--green-700); --surface-deepest:var(--green-900);
  --text-body:var(--ink-700); --text-on-dark:var(--cream-50); --text-on-dark-muted:rgba(245,239,227,.72);
  --color-primary:var(--green-700); --color-primary-hover:var(--green-800); --color-on-primary:var(--cream-50);
  --color-success:#3E7A5E;
  --border-hair:rgba(22,35,30,.10); --border-default:rgba(22,35,30,.16); --border-gold:rgba(176,137,78,.55); --border-on-dark:rgba(245,239,227,.22);
  --focus-ring:0 0 0 3px rgba(176,137,78,.45);

  /* type */
  --font-display:"Cormorant Garamond",Georgia,serif;
  --font-serif:"Lora",Georgia,serif;
  --font-sans:"Mulish",system-ui,-apple-system,"Segoe UI",sans-serif;

  /* radii / shadow / motion / layout */
  --radius-sm:4px; --radius-card:6px; --radius-md:8px; --radius-pill:999px;
  --shadow-sm:0 2px 8px rgba(22,35,30,.06);
  --shadow-md:0 10px 30px -12px rgba(22,35,30,.18);
  --shadow-card:0 14px 40px -20px rgba(22,35,30,.22);
  --shadow-lg:0 24px 60px -24px rgba(22,35,30,.28);
  --ease-soft:cubic-bezier(.22,.61,.36,1); --dur-fast:160ms; --dur-slow:520ms;
  --container-xl:1320px; --gutter:clamp(1.25rem,5vw,4rem);
}

*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  margin:0; background:var(--color-bg); color:var(--text-body);
  font-family:var(--font-serif); font-size:1.125rem; line-height:1.65;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
::selection { background:var(--gold-200); color:var(--ink-900); }
:focus-visible { outline:none; box-shadow:var(--focus-ring); border-radius:var(--radius-sm); }
h1,h2,h3 { font-family:var(--font-display); font-weight:500; letter-spacing:-.01em; color:var(--ink-900); margin:0; text-wrap:balance; }
p { text-wrap:pretty; }

.wrap { max-width:var(--container-xl); margin-inline:auto; padding-inline:var(--gutter); }

/* logo */
.logo { display:inline-flex; align-items:center; gap:14px; }
.logo svg { display:block; flex:none; }
.logo .name { font-family:var(--font-display); font-weight:500; line-height:1.04; color:var(--ink-900); }
.logo .name .a, .logo .name .b { font-size:19px; display:block; white-space:nowrap; }
.logo .desc { font-family:var(--font-sans); font-weight:600; font-size:9.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-700); margin-top:3px; }

/* nav */
header.nav { position:sticky; top:0; z-index:30; background:rgba(251,248,241,.86); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--border-hair); }
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:78px; }
.nav-links { display:flex; align-items:center; gap:34px; }
.nav-links a { font-family:var(--font-sans); font-weight:500; font-size:14px; letter-spacing:.02em; color:var(--ink-700); white-space:nowrap; transition:color var(--dur-fast) var(--ease-soft); }
.nav-links a:hover { color:var(--gold-700); }
.nav-toggle { display:none; background:none; border:0; cursor:pointer; padding:8px; flex-direction:column; gap:5px; }
.nav-toggle span { width:24px; height:2px; background:var(--green-800); border-radius:2px; transition:transform var(--dur-fast) var(--ease-soft), opacity var(--dur-fast); }
body.nav-open .nav-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
body.nav-open .nav-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; font-family:var(--font-sans); font-weight:600; font-size:13px; letter-spacing:.1em; text-transform:uppercase; line-height:1; border-radius:var(--radius-pill); padding:14px 26px; cursor:pointer; border:1.5px solid transparent; transition:all var(--dur-fast) var(--ease-soft); }
.btn-primary { background:var(--color-primary); color:var(--color-on-primary); border-color:var(--color-primary); }
.btn-primary:hover { background:var(--color-primary-hover); }
.btn-outline { background:transparent; color:var(--green-800); border-color:var(--border-gold); }
.btn-outline:hover { background:var(--gold-100); border-color:var(--gold-600); }
.btn .arrow { font-size:15px; line-height:0; }
.btn-sm { padding:11px 20px; font-size:12px; }

/* eyebrow */
.eyebrow { display:inline-flex; align-items:center; gap:12px; font-family:var(--font-sans); font-weight:600; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-700); }
.eyebrow::before { content:""; width:30px; height:1px; background:currentColor; opacity:.8; }

/* hero */
.hero { display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:center; padding:clamp(2.5rem,5vw,5rem) 0 clamp(3rem,6vw,5rem); }
.hero h1 { font-size:clamp(44px,6vw,82px); line-height:1.02; margin:22px 0 0; }
.hero h1 .it { font-style:italic; color:var(--green-700); }
.hero .lead { font-family:var(--font-serif); font-size:19px; line-height:1.62; color:var(--ink-600); max-width:46ch; margin:26px 0 34px; }
.hero-cta { display:flex; gap:14px; flex-wrap:wrap; }
.hero-media { position:relative; }
.hero-media img { width:100%; aspect-ratio:5/6; object-fit:cover; border-radius:200px 200px 12px 12px; box-shadow:var(--shadow-lg); }
.hero-media .stamp { position:absolute; left:-26px; bottom:40px; background:var(--cream-50); border:1px solid var(--border-gold); border-radius:var(--radius-pill); padding:12px 20px; display:flex; align-items:center; gap:12px; box-shadow:var(--shadow-md); }
.hero-media .stamp .t { font-family:var(--font-sans); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-500); }
.hero-media .stamp .v { font-family:var(--font-display); font-size:18px; color:var(--green-800); }

/* trust */
.trust { border-block:1px solid var(--border-hair); }
.trust-inner { display:flex; align-items:center; justify-content:center; gap:40px; flex-wrap:wrap; padding:22px 0; font-family:var(--font-sans); font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-500); }
.trust-inner span { display:inline-flex; align-items:center; gap:10px; }
.trust-inner .dot { width:5px; height:5px; border-radius:50%; background:var(--gold-500); }

/* section */
section { padding:clamp(3.5rem,7vw,7rem) 0; }
.sec-head { max-width:50ch; }
.sec-head h2 { font-size:clamp(32px,4.2vw,52px); line-height:1.08; margin:18px 0 0; }
.sec-head .lead { font-family:var(--font-serif); font-size:18px; line-height:1.6; color:var(--ink-600); margin-top:18px; }

/* about */
.about { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,5rem); align-items:center; }
.about-portrait { position:relative; }
.about-portrait > img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:12px; box-shadow:var(--shadow-card); }
.about-portrait .ring { position:absolute; top:-22px; right:-22px; }
.about p { font-family:var(--font-serif); font-size:17px; line-height:1.7; color:var(--ink-600); }
.sig { font-family:var(--font-display); font-style:italic; font-size:30px; color:var(--green-700); margin-top:10px; }
.creds { display:flex; gap:10px; flex-wrap:wrap; margin-top:26px; }
.badge { display:inline-flex; align-items:center; padding:7px 12px; font-family:var(--font-sans); font-weight:600; font-size:11px; letter-spacing:.14em; text-transform:uppercase; border-radius:var(--radius-sm); border:1px solid var(--border-gold); color:var(--gold-800); }

/* services */
.services { background:var(--surface-alt); }
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:48px; }
.card { background:var(--surface-card); border:1px solid var(--border-hair); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-card); display:flex; flex-direction:column; }
.card .ph { aspect-ratio:4/3; overflow:hidden; background:var(--cream-200); }
.card .ph img { width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease-soft); }
.card:hover .ph img { transform:scale(1.04); }
.card .body { padding:28px; display:flex; flex-direction:column; gap:12px; flex:1; }
.card .num { font-family:var(--font-sans); font-weight:600; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-700); }
.card h3 { font-family:var(--font-serif); font-weight:500; font-size:23px; color:var(--ink-900); }
.card p { font-family:var(--font-serif); font-size:15px; line-height:1.6; color:var(--ink-600); margin:0; }
.card .more { margin-top:auto; padding-top:8px; font-family:var(--font-sans); font-weight:600; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--green-700); }

/* gabinet */
.space-grid { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:14px; margin-top:44px; }
.space-grid img { width:100%; height:100%; object-fit:cover; border-radius:var(--radius-sm); }
.space-grid .tall { grid-row:span 2; }
.space-grid .wide { grid-column:span 2; }

/* quote */
.quoteband { background:var(--surface-deep); color:var(--text-on-dark); }
.quoteband .wrap { text-align:center; }
.quoteband .qmark { font-family:var(--font-display); font-size:80px; line-height:.4; color:var(--gold-500); }
.quoteband blockquote { font-family:var(--font-display); font-weight:500; font-size:clamp(28px,3.6vw,44px); line-height:1.25; color:var(--cream-50); max-width:22ch; margin:26px auto 28px; }
.quoteband cite { font-family:var(--font-sans); font-style:normal; font-weight:600; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-400); }

/* contact */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:start; margin-top:44px; }
.info-row { display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--border-hair); }
.info-row:first-child { border-top:1px solid var(--border-hair); }
.info-row .k { font-family:var(--font-sans); font-weight:600; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-700); width:110px; flex:none; padding-top:3px; }
.info-row .v { font-family:var(--font-serif); font-size:17px; color:var(--ink-800); line-height:1.5; }
.info-row .v a:hover { color:var(--gold-700); }
.form { background:var(--surface-card); border:1px solid var(--border-hair); border-radius:var(--radius-md); padding:32px; box-shadow:var(--shadow-card); display:flex; flex-direction:column; gap:18px; }
.field { display:flex; flex-direction:column; gap:7px; }
.field label { font-family:var(--font-sans); font-weight:600; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--green-800); }
.field input, .field textarea { font-family:var(--font-serif); font-size:15px; color:var(--ink-900); background:var(--cream-50); border:1px solid var(--border-default); border-radius:var(--radius-sm); padding:12px 14px; outline:none; transition:all var(--dur-fast) var(--ease-soft); }
.field input:focus, .field textarea:focus { border-color:var(--gold-600); box-shadow:var(--focus-ring); background:#fff; }
.field textarea { min-height:110px; resize:vertical; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

/* footer */
footer.foot { background:var(--surface-deepest); color:var(--text-on-dark-muted); padding:56px 0 36px; }
.foot-top { display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; align-items:flex-start; }
.foot .logo .name .a, .foot .logo .name .b { color:var(--cream-50); }
.foot-links { display:flex; gap:30px; flex-wrap:wrap; }
.foot-links a { font-family:var(--font-sans); font-size:13px; color:var(--text-on-dark-muted); }
.foot-links a:hover { color:var(--gold-400); }
.foot-bottom { margin-top:40px; padding-top:22px; border-top:1px solid var(--border-on-dark); display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-family:var(--font-sans); font-size:12px; color:rgba(245,239,227,.5); }

@media (max-width:900px){
  .hero,.about,.contact-grid{ grid-template-columns:1fr; }
  .svc-grid{ grid-template-columns:1fr; }
  .space-grid{ grid-template-columns:1fr 1fr; }
  .nav-toggle{ display:flex; }
  .nav-links{
    position:fixed; inset:78px 0 auto 0; flex-direction:column; align-items:stretch; gap:0;
    background:var(--cream-50); border-bottom:1px solid var(--border-hair); padding:8px 0 16px;
    box-shadow:var(--shadow-md); transform:translateY(-12px); opacity:0; pointer-events:none;
    transition:opacity var(--dur-fast) var(--ease-soft), transform var(--dur-fast) var(--ease-soft);
  }
  body.nav-open .nav-links{ transform:translateY(0); opacity:1; pointer-events:auto; }
  .nav-links a:not(.btn){ padding:14px var(--gutter); border-bottom:1px solid var(--border-hair); font-size:16px; }
  .nav-links .btn{ margin:14px var(--gutter) 0; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ transition:none !important; }
}
