:root{
  --ink:#29313d;
  --soft:#68707a;
  --paper:#f7f4ee;
  --paper-deep:#ece7de;
  --white:#fff;
  --gold:#b89455;
  --gold-light:#d7c08d;
  --dark:#2c323a;
  --line:rgba(41,49,61,.14);
  --serif:"Tenor Sans","Helvetica Neue",Arial,sans-serif;
  --sans:"Inter",Arial,sans-serif;
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  overflow-x:hidden;
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.7;
  overflow-x:hidden;
}

img{
  display:block;
  max-width:100%;
  height:auto;
}

a{color:inherit}

button,input,textarea{font:inherit}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Header */
.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:1000;
  min-height:130px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:18px 6vw;
  background:rgba(247,244,238,.96);
  backdrop-filter:blur(18px);
  border-bottom:1px solid transparent;
  transition:min-height .35s ease,background .35s ease,border-color .35s ease,box-shadow .35s ease;
}

.site-header.scrolled{
  min-height:108px;
  border-bottom-color:rgba(184,148,85,.22);
  box-shadow:0 18px 45px rgba(41,49,61,.08);
}

.brand{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.brand img{
  width:200px;
  max-height:125px;
  object-fit:contain;
  transition:width .35s ease,max-height .35s ease,transform .35s ease;
}

.site-header.scrolled .brand img{
  width:175px;
  max-height:105px;
}

/* Store menu */
.store-switcher{
  display:grid;
  gap:9px;
  z-index:2;
}

.store-line{
  width:42px;
  height:9px;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
}

.store-line>span:first-child{
  display:block;
  width:32px;
  height:1px;
  margin-left:auto;
  background:var(--ink);
  transition:width .2s ease,background .2s ease;
}

.store-line:hover>span:first-child,
.store-line[aria-expanded="true"]>span:first-child{
  width:42px;
  background:var(--gold);
}

.store-panel{
  position:fixed;
  top:112px;
  right:6vw;
  width:min(390px,90vw);
  padding:28px 30px 30px;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(184,148,85,.4);
  box-shadow:0 24px 65px rgba(41,49,61,.16);
}

.store-panel[hidden]{display:none}

.panel-label{
  margin:0 0 8px;
  color:var(--gold);
  font-size:10px;
  letter-spacing:.24em;
  text-transform:uppercase;
}

.store-panel h2{
  margin:0 0 14px;
  font-family:var(--serif);
  font-size:38px;
  font-weight:500;
  line-height:1;
}

.store-panel p{
  margin:0 0 22px;
  color:var(--soft);
  line-height:1.65;
}

.store-panel a{
  color:var(--gold);
  text-decoration:none;
  border-bottom:1px solid var(--gold);
  padding-bottom:3px;
}

/* General sections */
.section{
  position:relative;
  padding:112px 8vw;
}

.eyebrow{
  margin:0;
  color:var(--gold);
  font-size:11px;
  font-weight:500;
  letter-spacing:.28em;
  text-transform:uppercase;
}

h1,h2,h3{color:var(--ink)}

.hero h1,
.section h2,
.service-card h3,
.values-grid h3{
  font-family:var(--serif);
  font-weight:500;
}

/* Hero */
.hero{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding-top:210px;
  padding-bottom:100px;
  text-align:center;
}

.hero-content{
  width:100%;
  max-width:980px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.hero h1{
  font-size:clamp(2rem,7vw,3.2rem);
  line-height:1.18;
  max-width:12ch;
  letter-spacing:-0.02em;
}

.lead{
  max-width:720px;
  margin:0 auto 42px;
  font-family:var(--serif);
  font-size:clamp(25px,3vw,36px);
  line-height:1.28;
}

.sublead{
  max-width:650px;
  margin:0 auto 52px;
  color:var(--soft);
  line-height:1.85;
}

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:13px 26px;
  border:1px solid var(--gold);
  border-radius:999px;
  background:var(--gold);
  color:var(--white);
  text-decoration:none;
  font-size:14px;
  cursor:pointer;
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}

.button:hover{
  background:#9f7e44;
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(159,126,68,.2);
}

/* Split section */
.split{
  display:grid;
  grid-template-columns:70px minmax(260px,1fr) minmax(320px,1.1fr);
  gap:5vw;
  border-top:1px solid var(--line);
}

.section-number{
  color:var(--gold);
  font-family:var(--serif);
  font-size:28px;
}

.section-heading h2,
.section-intro h2,
.story h2,
.contact h2{
  margin:18px auto 0;
  max-width:14ch;
  font-size:clamp(22px,5.2vw,32px);
  line-height:1.45;
  letter-spacing:.01em;
  font-weight:400;
}

.section-copy p{margin:0 0 26px}

.section-copy strong{
  display:block;
  margin-top:20px;
  font-family:var(--serif);
  font-size:24px;
  font-weight:500;
  line-height:1.35;
}

.section-intro{
  max-width:780px;
  margin:0 auto 66px;
  text-align:center;
}

/* Services */
.services{
  background:var(--dark);
  color:#f7f5f0;
}

.services h2,
.services h3{
  color:#f7f5f0;
}

.services .eyebrow{color:var(--gold-light)}

.service-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  background:rgba(255,255,255,.14);
}

.service-card{
  min-height:320px;
  padding:44px;
  background:var(--dark);
}

.service-card span,
.values-grid span{
  color:var(--gold-light);
  font-size:11px;
  letter-spacing:.2em;
}

.service-card h3,
.values-grid h3{
  margin:22px 0 14px;
  font-size:28px;
  line-height:1.14;
}

.service-card p{
  margin:0;
  color:#d9dcdf;
}

/* Manifesto */
.manifesto{
  min-height:72vh;
  display:grid;
  place-items:center;
  text-align:center;
  overflow:hidden;
}

.manifesto-inner{
  width:100%;
  max-width:1000px;
  margin:0 auto;
}

.manifesto p{
  margin:5px 0;
  font-family:var(--serif);
  font-size:clamp(25px,3.2vw,44px);
  line-height:1.22;
}

.manifesto h2{
  width:100%;
  max-width:100%;
  margin:42px auto 0;
  color:var(--gold);
  font-size:clamp(44px,5.8vw,78px);
  line-height:1.05;
  overflow-wrap:normal;
  word-break:normal;
}

/* Story */
.story{
  display:grid;
  grid-template-columns:minmax(280px,.8fr) minmax(340px,1.2fr);
  gap:8vw;
  align-items:center;
  background:var(--paper-deep);
}

.story-mark{
  aspect-ratio:3 / 2;
  width:100%;
  max-width:640px;
  margin:0 auto;
  display:block;
  border:0;
  border-radius:28px;
  clip-path:none;
  position:relative;
  overflow:hidden;
  background:transparent;
}

.story-mark img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  border-radius:28px;
  transform:scale(1.07);
  transform-origin:center;
}

.story-mark:before,
.story-mark:after{
  display:none;
}

.story-copy{max-width:760px}

.story-copy h2{margin-bottom:58px}

.story-text p{
  max-width:660px;
  margin:0 auto 44px;
  text-align:center;
  line-height:1.9;
}

.story-text p:last-child{margin-bottom:0}

/* Values */
.values-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.values-grid article{
  padding:34px 26px;
  border-right:1px solid var(--line);
  text-align:center;
}

.values-grid article:last-child{border-right:0}

.values-grid p{
  margin:0;
  color:var(--soft);
}

/* Contact */
.contact{
  display:grid;
  grid-template-columns:minmax(280px,1fr) minmax(320px,1fr);
  gap:9vw;
  background:var(--dark);
  color:var(--white);
}

.contact h2{color:var(--white)}

.contact-copy>p:last-of-type{color:#d7dadd}

.contact-details{
  margin-top:42px;
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,.18);
}

.contact-details p{
  margin:7px 0;
  color:#d7dadd;
  font-size:14px;
}

.contact-details a{
  color:var(--gold-light);
  text-decoration:none;
}

.contact-form{
  display:grid;
  gap:22px;
}

.contact-form label{
  color:var(--gold-light);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.contact-form input,
.contact-form textarea{
  display:block;
  width:100%;
  padding:12px 0;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.3);
  background:transparent;
  color:var(--white);
  outline:none;
}

.honey{
  position:absolute!important;
  left:-9999px!important;
}

/* Footer */
footer{
  padding:64px 20px;
  background:#23282f;
  color:#d7dadd;
  text-align:center;
}

footer img{
  width:170px;
  margin:0 auto 18px;
  filter:brightness(4) grayscale(1);
}

footer p{
  margin:0 0 10px;
  font-size:13px;
}

footer small{color:#9fa4aa}

.footer-links{
  margin-top:28px;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:18px;
}

.footer-links a{
  color:#d7c08d;
  text-decoration:none;
  font-size:13px;
}

.footer-links a:hover{color:#fff}

/* Legal pages */
.legal-header{
  min-height:112px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 24px;
  border-bottom:1px solid var(--line);
}

.legal-header img{
  width:150px;
  max-height:96px;
  object-fit:contain;
}

.legal-main{
  width:min(880px,calc(100% - 40px));
  margin:0 auto;
  padding:88px 0 100px;
}

.legal-main h1{
  margin:0 0 26px;
  font-family:var(--serif);
  font-size:clamp(48px,8vw,78px);
  font-weight:500;
  line-height:.96;
  text-align:center;
}

.legal-main h2{
  margin:52px 0 14px;
  font-family:var(--serif);
  font-size:34px;
  font-weight:500;
  line-height:1.1;
}

.legal-main .meta{
  margin:0 0 42px;
  color:var(--soft);
  font-size:14px;
  text-align:center;
}

.legal-main .intro{
  max-width:720px;
  margin:0 auto 56px;
  color:var(--soft);
  font-size:18px;
  text-align:center;
}

.legal-main p,
.legal-main li{
  font-size:16px;
}

.legal-main ul{padding-left:22px}

.legal-main .notice{
  margin-top:42px;
  padding:24px;
  border:1px solid rgba(184,148,85,.45);
  background:rgba(255,255,255,.45);
}

.legal-main .back{
  display:inline-block;
  margin-top:34px;
  color:var(--gold);
  text-decoration:none;
  border-bottom:1px solid var(--gold);
}

/* Tablet */
@media(max-width:900px){
  .site-header{
    min-height:116px;
    padding:12px 6vw;
  }

  .site-header.scrolled{min-height:102px}

  .brand img{
    width:170px;
    max-height:108px;
  }

  .site-header.scrolled .brand img{
    width:155px;
    max-height:96px;
  }

  .store-panel{
    top:106px;
    right:6vw;
  }

  .section{padding:88px 7vw}

  .hero{
    min-height:auto;
    padding-top:185px;
    padding-bottom:88px;
  }

  .hero h1{font-size:clamp(50px,11vw,74px)}

  .split,
  .story,
  .contact{
    grid-template-columns:1fr;
    text-align:center;
  }

  .section-number{display:none}

  .section-heading,
  .section-copy,
  .story-copy,
  .contact-copy{
    max-width:700px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }

  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

  .service-card{text-align:center}

  .values-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

  .contact-form{
    max-width:640px;
    margin:0 auto;
    text-align:left;
  }
}

/* Mobile */
@media(max-width:600px){
  .site-header{
    min-height:118px;
    padding:8px 22px;
  }

  .site-header.scrolled{min-height:96px}

  .brand img{
    width:184px;
    max-height:112px;
  }

  .site-header.scrolled .brand img{
    width:166px;
    max-height:102px;
  }

  .store-switcher{gap:8px}

  .store-line{width:38px}

  .store-line>span:first-child{width:28px}

  .store-panel{
    top:101px;
    right:16px;
    width:calc(100vw - 32px);
    padding:24px;
  }

  .section{padding:74px 22px}

  .hero{
    padding:118px 18px 70px;
  }

  .hero h1{
    max-width:620px;
    margin:8px auto 28px;
    font-size:34px;
    line-height:1.16;
    letter-spacing:-.01em;
  }

  .lead{
    max-width:360px;
    margin-bottom:40px;
    font-size:23px;
  }

  .sublead{
    max-width:350px;
    margin-bottom:48px;
    font-size:16px;
  }

  .section-heading h2,
  .section-intro h2,
  .story h2,
  .contact h2{
    font-size:clamp(33px,8.8vw,44px);
  }

  .service-grid{grid-template-columns:1fr}

  .service-card{
    min-height:auto;
    padding:34px 24px;
  }

  .manifesto{min-height:auto}

  .manifesto h2{
    margin-top:36px;
    font-size:52px;
    line-height:.95;
  }

  .values-grid{grid-template-columns:1fr}

  .values-grid article{
    border-right:0;
    border-bottom:1px solid var(--line);
  }

  .story{
    padding-left:18px;
    padding-right:18px;
  }

  .story-mark{
    width:min(88vw,380px);
    max-width:380px;
  }

  .story-copy h2{margin-bottom:54px}

  .story-text p{
    max-width:350px;
    margin-bottom:46px;
  }

  .legal-header{min-height:102px}

  .legal-header img{width:132px}

  .legal-main{padding:68px 0 82px}

  .legal-main h1{font-size:50px}

  .legal-main h2{font-size:30px}
}

/* Final mobile typography and spacing fixes */
@media(max-width:600px){

  /* Mniejsze nagłówki sekcji */
  .section-heading h2,
  .section-intro h2,
  .story h2,
  .contact h2{
    max-width:none;
    margin:14px auto 0;
    font-size:24px;
    line-height:1.5;
    letter-spacing:.02em;
    font-weight:400;
  }

  /* Mniej pustej przestrzeni na początku grafitowej sekcji */
  .services{
    padding-top:48px;
  }

  .services .section-intro{
    margin-bottom:38px;
  }

  /* Mniejszy nagłówek na grafitowym tle */
  .services .section-intro h2{
    max-width:100%;
    font-size:26px;
    line-height:1.45;
  }

  /* Mniejsze tytuły kart */
  .service-card h3{
    font-size:23px;
    line-height:1.35;
  }

  /* Mniejszy tekst Manifesto */
  .manifesto p{
    font-size:22px;
    line-height:1.45;
  }

  .manifesto h2{
    margin-top:32px;
    font-size:40px;
    line-height:1.15;
  }

  /* Mniejszy nagłówek Philosophy */
  .story-copy h2{
    max-width:100%;
    margin-bottom:38px;
    font-size:25px;
    line-height:1.5;
  }

  /* Mniejszy Core Values */
  .values .section-intro h2{
    max-width:100%;
    font-size:25px;
    line-height:1.45;
  }

  .values-grid h3{
    font-size:22px;
    line-height:1.3;
  }
}

/* Final mobile refinement */
@media(max-width:600px){

  /* Główny nagłówek taki sam stylistycznie jak pozostałe */
  .hero h1{
    max-width:100%;
    margin:8px auto 28px;
    font-size:24px;
    line-height:1.5;
    letter-spacing:.02em;
    font-weight:400;
  }

  /* Pozostałe nagłówki jeszcze delikatniejsze */
  .section-heading h2,
  .section-intro h2,
  .story h2,
  .contact h2{
    max-width:100%;
    margin:14px auto 0;
    font-size:22px;
    line-height:1.5;
    letter-spacing:.02em;
    font-weight:400;
  }

  /* Mniej pustej przestrzeni w grafitowej sekcji */
  .services{
    padding-top:30px;
    padding-bottom:48px;
  }

  .services .section-intro{
    margin-bottom:24px;
  }

  .services .section-intro h2{
    font-size:23px;
    line-height:1.45;
    margin-top:10px;
  }

  /* Mniejsze odstępy wewnątrz kart */
  .service-card{
    padding:28px 24px;
  }

  .service-card h3{
    font-size:21px;
    line-height:1.35;
  }

  /* Manifesto bardziej zwarte */
  .manifesto{
    min-height:auto;
    padding-top:54px;
    padding-bottom:54px;
  }

  .manifesto p{
    font-size:20px;
    line-height:1.5;
  }

  /* Glory Loves Order w jednej linii */
  .manifesto h2{
    width:100%;
    max-width:none;
    margin:28px auto 0;
    font-size:34px;
    line-height:1.15;
    white-space:nowrap;
    letter-spacing:.01em;
  }

  /* Mniej miejsca w sekcji Philosophy */
  .story-copy h2{
    font-size:23px;
    line-height:1.5;
    margin-bottom:30px;
  }

  /* Mniej miejsca nad Core Values */
  .values{
    padding-top:50px;
  }

  .values .section-intro{
    margin-bottom:34px;
  }

  .values .section-intro h2{
    font-size:23px;
    line-height:1.45;
  }
}