:root{
  --ink:#18211f;
  --muted:#68706d;
  --paper:#f3f0e8;
  --paper2:#e9e5da;
  --forest:#173a34;
  --forest2:#0e2c27;
  --white:#fff;
  --line:rgba(24,33,31,.13);
  --shell:1180px;
  --sans:"DM Sans",system-ui,sans-serif;
  --serif:"Newsreader",Georgia,serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.65;
}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
.shell{width:min(calc(100% - 48px),var(--shell));margin:auto}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:-.025em}
.eyebrow{
  font-family:var(--sans);
  font-size:.66rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:rgba(255,255,255,.58);
  margin-bottom:18px;
}
.eyebrow.dark{color:#68736d}
.text-link{
  display:inline-block;
  padding-bottom:2px;
  border-bottom:1px solid currentColor;
  font-size:.82rem;
}
.dark-link{color:var(--forest)}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  border-radius:999px;
  font-family:var(--sans);
  font-weight:600;
  font-size:.8rem;
}
.btn-primary{background:var(--forest);color:#fff}
.full{width:100%}

/* header */
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:1000;
  background:rgba(243,240,232,.95);
  border-bottom:1px solid var(--line);
}
.header-inner{
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.brand{display:flex;flex-direction:column;line-height:1.1}
.brand strong{font-family:var(--serif);font-size:1.15rem}
.brand span{
  margin-top:4px;
  font-size:.58rem;
  text-transform:uppercase;
  letter-spacing:.11em;
  color:var(--muted);
}
.nav{display:flex;gap:26px;align-items:center}
.nav a{font-size:.76rem}
.menu-toggle{display:none}

/* hero */
.hero{
  padding:148px 0 100px;
  background:var(--forest2);
  color:white;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:80px;
}
.hero-copy h1{
  max-width:10ch;
  font-size:clamp(4.2rem,6.1vw,6.7rem);
  line-height:.92;
  margin-bottom:30px;
}
.hero-lead{
  max-width:590px;
  color:rgba(255,255,255,.69);
  font-size:1.05rem;
}
.hero-actions{display:flex;align-items:center;gap:22px;margin-top:34px}
.hero-actions .text-link{color:rgba(255,255,255,.8)}

.hero-visual{
  position:relative;
  min-height:570px;
}
.hero-image{
  position:absolute;
  background:
    linear-gradient(160deg,rgba(255,255,255,.03),rgba(255,255,255,.02)),
    linear-gradient(145deg,#7f9991,#d4c6b6);
}
.hero-image-main{
  inset:0 70px 70px 0;
}
.hero-image-small{
  width:48%;
  height:45%;
  right:0;
  bottom:0;
  background:linear-gradient(145deg,#b7a48e,#6f8981);
  border:10px solid var(--forest2);
}
.hero-caption{
  position:absolute;
  left:22px;
  bottom:30px;
  padding:16px 18px;
  background:rgba(244,240,232,.96);
  color:var(--ink);
  min-width:270px;
}
.hero-caption span{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.hero-caption strong{display:block;margin-top:5px;font-family:var(--serif);font-size:1.1rem;font-weight:500}

/* intro */
.intro{padding:120px 0;background:#f7f5ef}
.intro-grid{
  display:grid;
  grid-template-columns:.15fr .95fr .9fr;
  gap:48px;
  align-items:start;
}
.section-number{
  font-family:var(--serif);
  font-size:1.3rem;
  color:#9ca19d;
}
.intro-title h2{
  font-size:clamp(3.1rem,4.8vw,5rem);
  line-height:.98;
}
.intro-copy{padding-top:38px}
.intro-copy p{color:var(--muted);max-width:540px}

/* team */
.team-section{padding:120px 0;background:var(--paper)}
.section-head{
  display:grid;
  grid-template-columns:1fr .65fr;
  gap:80px;
  align-items:end;
  margin-bottom:58px;
}
.section-head h2{
  font-size:clamp(3.2rem,4.8vw,5.2rem);
  line-height:.98;
  margin-bottom:0;
}
.section-head>p{color:var(--muted);margin-bottom:6px}

.team-list{border-top:1px solid var(--line)}
.person{
  display:grid;
  grid-template-columns:180px 1fr 210px;
  gap:34px;
  align-items:center;
  padding:28px 0;
  border-bottom:1px solid var(--line);
}
.person-photo{
  width:180px;
  aspect-ratio:4/5;
  background:#a6b3ad;
}
.photo-a{background:linear-gradient(145deg,#b58d7d,#d5b6a3)}
.photo-b{background:linear-gradient(145deg,#6e9197,#9fb6ba)}
.photo-c{background:linear-gradient(145deg,#8a8d70,#c1c1a5)}
.photo-d{background:linear-gradient(145deg,#747887,#aeb1bb)}
.person-role{
  margin-bottom:8px;
  font-size:.65rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted);
}
.person-main h3{font-size:2.25rem;margin-bottom:12px}
.person-main p:last-child{max-width:650px;color:var(--muted)}
.person-meta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:9px;
  font-size:.72rem;
  color:var(--muted);
}
.person-meta a{
  margin-top:7px;
  color:var(--ink);
  border-bottom:1px solid currentColor;
}

/* areas */
.areas-section{
  padding:120px 0;
  background:var(--forest);
  color:white;
}
.areas-grid{
  display:grid;
  grid-template-columns:.65fr 1.35fr;
  gap:100px;
}
.areas-heading h2{
  font-size:clamp(3rem,4.5vw,4.8rem);
  line-height:.98;
}
.areas-list{border-top:1px solid rgba(255,255,255,.18)}
.areas-list>div{
  display:grid;
  grid-template-columns:54px 1fr 1fr;
  gap:24px;
  padding:26px 0;
  border-bottom:1px solid rgba(255,255,255,.18);
  align-items:start;
}
.areas-list span{font-family:var(--serif);color:rgba(255,255,255,.38)}
.areas-list h3{font-size:1.5rem;margin:0}
.areas-list p{margin:0;color:rgba(255,255,255,.62)}

/* choice */
.choice-section{padding:110px 0;background:#dfe5df}
.choice-grid{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:100px;
  align-items:start;
}
.choice-grid h2{
  font-size:clamp(3rem,4.6vw,4.8rem);
  line-height:.98;
  max-width:11ch;
}
.choice-grid>div:last-child{padding-top:38px}
.choice-grid>div:last-child p{color:#5e6863;max-width:540px}

/* pricing */
.pricing-section{padding:120px 0;background:#f7f5ef}
.pricing-grid{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:100px;
}
.pricing-grid h2{
  font-size:clamp(3rem,4.5vw,4.8rem);
  line-height:.98;
}
.pricing-intro{color:var(--muted)}
.pricing-list{border-top:1px solid var(--line)}
.pricing-list>div{
  display:grid;
  grid-template-columns:1fr auto;
  gap:4px 30px;
  padding:24px 0;
  border-bottom:1px solid var(--line);
}
.pricing-list span{font-weight:500}
.pricing-list strong{font-family:var(--serif);font-size:1.65rem;font-weight:500}
.pricing-list small{grid-column:1/-1;color:var(--muted)}

/* contact */
.contact-section{
  padding:120px 0;
  background:var(--forest2);
  color:white;
}
.contact-grid{
  display:grid;
  grid-template-columns:1fr .78fr;
  gap:90px;
  align-items:center;
}
.contact-grid h2{
  font-size:clamp(3.2rem,5vw,5.3rem);
  line-height:.97;
  max-width:9ch;
}
.contact-grid>div>p:not(.eyebrow){color:rgba(255,255,255,.63);max-width:560px}
.contact-data{margin-top:34px}
.contact-data div{
  display:grid;
  grid-template-columns:90px 1fr;
  gap:20px;
  padding:13px 0;
  border-top:1px solid rgba(255,255,255,.16);
}
.contact-data div:last-child{border-bottom:1px solid rgba(255,255,255,.16)}
.contact-data span{
  font-size:.66rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:rgba(255,255,255,.46);
}
.booking-panel{
  background:var(--paper);
  color:var(--ink);
  padding:44px;
}
.booking-panel .eyebrow{color:var(--muted)}
.booking-panel h3{
  margin:52px 0 16px;
  font-size:2.8rem;
}
.booking-panel>p:not(.eyebrow){color:var(--muted);margin-bottom:34px}

/* footer */
.site-footer{padding:46px 0 22px;background:#091d19;color:white}
.footer-grid{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:70px;
}
.footer-grid strong{font-family:var(--serif);font-size:1.2rem;font-weight:500}
.footer-grid p{font-size:.7rem;color:rgba(255,255,255,.43)}
.footer-grid nav{display:flex;flex-direction:column;gap:7px}
.footer-grid nav a{font-size:.7rem;color:rgba(255,255,255,.64)}
.footer-bottom{
  margin-top:34px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;
  justify-content:space-between;
  font-size:.66rem;
  color:rgba(255,255,255,.4);
}
.footer-bottom a{text-decoration:underline}

.demo-bar{padding:15px 0;background:#fff}
.demo-bar .shell{display:flex;justify-content:space-between;gap:20px}
.demo-bar p{margin:0;font-size:.76rem}
.demo-bar p span{font-weight:600;margin-right:9px}
.demo-bar a{font-size:.74rem;text-decoration:underline}

/* mobile */
@media(max-width:900px){
  .shell{width:min(calc(100% - 34px),var(--shell))}
  .site-header{height:68px}
  .header-inner{min-height:68px}
  .brand{position:relative;z-index:2002}
  .brand span{display:none}
  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:72px;
    min-height:37px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    position:relative;
    z-index:2002;
    font-size:.68rem;
    text-transform:uppercase;
    letter-spacing:.07em;
  }
  .nav{
    position:fixed;
    top:68px;left:0;right:0;
    height:calc(100dvh - 68px);
    background:var(--paper);
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:22px 18px;
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    pointer-events:none;
    z-index:2000;
  }
  .nav.active{opacity:1;visibility:visible;transform:none;pointer-events:auto}
  .nav a{
    min-height:56px;
    display:flex;
    align-items:center;
    border-bottom:1px solid var(--line);
    font-family:var(--serif);
    font-size:1.5rem;
  }

  .hero{padding:118px 0 70px}
  .hero-grid{grid-template-columns:1fr;gap:54px}
  .hero-copy h1{font-size:clamp(4rem,10vw,6rem)}
  .hero-visual{max-width:700px;width:100%;min-height:520px}

  .intro-grid{grid-template-columns:50px 1fr;gap:26px}
  .intro-copy{grid-column:2;padding-top:0}

  .section-head{grid-template-columns:1fr;gap:22px}
  .person{grid-template-columns:140px 1fr}
  .person-photo{width:140px}
  .person-meta{grid-column:2}

  .areas-grid,.choice-grid,.pricing-grid,.contact-grid{
    grid-template-columns:1fr;
    gap:48px;
  }
  .choice-grid>div:last-child{padding-top:0}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-grid>div{grid-column:1/-1}
}

@media(max-width:620px){
  .shell{width:calc(100% - 26px)}
  .hero{padding:102px 0 58px}
  .hero-copy h1{font-size:clamp(3.3rem,15vw,4.5rem)}
  .hero-actions{flex-direction:column;align-items:flex-start}
  .hero-actions .btn{width:100%}

  .hero-visual{min-height:380px}
  .hero-image-main{inset:0 44px 54px 0}
  .hero-image-small{border-width:7px}
  .hero-caption{left:12px;bottom:16px;min-width:220px}

  .intro,.team-section,.areas-section,.choice-section,.pricing-section,.contact-section{
    padding:82px 0;
  }

  .intro-grid{grid-template-columns:1fr}
  .section-number{display:none}
  .intro-copy{grid-column:auto}
  .intro-title h2,.section-head h2,.areas-heading h2,.choice-grid h2,.pricing-grid h2,.contact-grid h2{
    font-size:clamp(2.7rem,13vw,3.8rem);
  }

  .person{
    grid-template-columns:90px 1fr;
    gap:18px;
    padding:22px 0;
  }
  .person-photo{width:90px}
  .person-main h3{font-size:1.7rem}
  .person-main p:last-child{font-size:.9rem}
  .person-meta{
    grid-column:1/-1;
    flex-direction:row;
    flex-wrap:wrap;
    gap:8px 14px;
  }

  .areas-list>div{
    grid-template-columns:36px 1fr;
    gap:14px;
  }
  .areas-list p{grid-column:2}

  .pricing-list>div{
    grid-template-columns:1fr;
  }
  .pricing-list small{grid-column:auto}

  .contact-data div{grid-template-columns:1fr;gap:4px}
  .booking-panel{padding:30px 24px}

  .footer-grid{grid-template-columns:1fr;gap:26px}
  .footer-grid>div{grid-column:auto}
  .footer-bottom,.demo-bar .shell{flex-direction:column;gap:7px}
}


/* =====================================================
   TEAM — poprawka header / kontakt / footer
   ===================================================== */

/* Header ma własną warstwę i nie może pojawiać się w środku strony */
.site-header{
  position:sticky !important;
  top:0;
  left:auto;
  right:auto;
  width:100%;
  z-index:3000;
  background:rgba(243,240,232,.98);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

/* Tylko nawigacja w headerze korzysta z układu poziomego */
.site-header .nav{
  display:flex;
  align-items:center;
  gap:26px;
}

/* Kontakt ma własny kontekst i bezpieczny odstęp od stopki */
.contact-section{
  position:relative;
  z-index:1;
  padding-top:120px;
  padding-bottom:120px;
  overflow:hidden;
}

.contact-grid{
  position:relative;
  z-index:2;
}

/* Stopka zawsze zaczyna się po kontakcie i ma własne ciemne tło */
.site-footer{
  position:relative;
  z-index:2;
  clear:both;
  width:100%;
  margin:0;
  padding:46px 0 22px;
  background:#091d19 !important;
  color:#fff;
}

/* Style stopki nie mogą odziedziczyć reguł z menu głównego */
.site-footer nav{
  position:static !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  pointer-events:auto !important;
  overflow:visible !important;
}

.site-footer nav a{
  display:inline !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  font-family:var(--sans) !important;
  font-size:.7rem !important;
  font-weight:400 !important;
  color:rgba(255,255,255,.64) !important;
}

.site-footer .footer-grid{
  position:relative;
  z-index:1;
}

.site-footer .footer-bottom{
  position:relative;
  z-index:1;
}

/* Pasek demo zawsze pod stopką */
.demo-bar{
  position:relative;
  z-index:1;
  clear:both;
}

/* MOBILE */
@media(max-width:900px){

  .site-header{
    height:68px;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }

  .site-header .nav{
    position:fixed !important;
    top:68px !important;
    left:0 !important;
    right:0 !important;
    width:100vw !important;
    height:calc(100dvh - 68px) !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:0 !important;

    padding:22px 18px max(28px,env(safe-area-inset-bottom)) !important;
    background:var(--paper) !important;

    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    pointer-events:none;
    overflow-y:auto;

    z-index:2999;
  }

  .site-header .nav.active{
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
  }

  .site-header .nav a{
    min-height:56px;
    display:flex !important;
    align-items:center;
    padding:0 !important;
    border-bottom:1px solid var(--line) !important;
    font-family:var(--serif) !important;
    font-size:1.5rem !important;
    color:var(--ink) !important;
  }

  .contact-section{
    padding-top:88px;
    padding-bottom:88px;
  }

  .site-footer{
    padding-top:42px;
  }
}

@media(max-width:620px){

  .site-header{
    height:66px;
  }

  .site-header .nav{
    top:66px !important;
    height:calc(100dvh - 66px) !important;
  }

  .contact-section{
    padding-top:78px;
    padding-bottom:78px;
  }

  .site-footer .footer-grid{
    grid-template-columns:1fr !important;
    gap:26px !important;
  }

  .site-footer .footer-bottom{
    flex-direction:column;
    gap:6px;
  }
}

/* =====================================================
   HERO TEAM — zdjęcia mieszczące się w szerokości strony
   ===================================================== */

*,
*::before,
*::after{
  box-sizing:border-box;
}

/* zabezpieczenie całej strony */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

/* główny kontener */
.shell{
  width:min(100% - 40px, 1440px);
  margin-inline:auto;
}

/* hero */
.hero{
  overflow:hidden;
}

.hero-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:70px;
  align-items:center;
}

/* bardzo ważne przy CSS Grid */
.hero-copy,
.hero-visual{
  min-width:0;
}

/* prawa część hero */
.hero-visual{
  position:relative;
  width:100%;
  max-width:680px;
  min-height:620px;
  justify-self:end;
  overflow:visible;
}


/* DUŻE ZDJĘCIE — ludzie.jpg */
.hero-image-main{
  position:absolute;
  top:0;
  left:0;

  width:78%;
  height:470px;

  overflow:hidden;
  z-index:1;
}


/* MNIEJSZE ZDJĘCIE — gabinet.jpg */
.hero-image-small{
  position:absolute;
  right:0;
  bottom:0;

  width:52%;
  height:330px;

  overflow:hidden;
  z-index:2;

  border:12px solid #10392f;
}


/* oba zdjęcia */
.hero-image img{
  width:100%;
  height:100%;
  display:block;

  object-fit:cover;
  object-position:center;

  max-width:100%;
}


/* zespół */
.hero-image-main img{
  object-position:center center;
}


/* gabinet */
.hero-image-small img{
  object-position:center center;
}


/* podpis */
.hero-caption{
  position:absolute;
  left:5%;
  bottom:80px;
  z-index:3;

  width:min(340px, 65%);
}


/* =====================================================
   TABLET
   ===================================================== */

@media(max-width:1000px){

  .hero-grid{
    grid-template-columns:1fr;
    gap:50px;
  }

  .hero-visual{
    justify-self:start;
    width:100%;
    max-width:760px;
    min-height:600px;
  }

}


/* =====================================================
   MOBILE
   ===================================================== */

@media(max-width:650px){

  .shell{
    width:min(100% - 28px, 1440px);
  }

  .hero-grid{
    gap:36px;
  }

  .hero-visual{
    min-height:430px;
    max-width:100%;
  }

  .hero-image-main{
    width:82%;
    height:330px;
  }

  .hero-image-small{
    width:54%;
    height:220px;
    border-width:8px;
  }

  .hero-caption{
    left:16px;
    bottom:35px;
    width:70%;
  }

}

/* =====================================================
   TEAM — MOBILE FINAL PATCH 2026-09-23
   ===================================================== */

@media (max-width: 1000px){
  html,body{overflow-x:hidden}
  .shell{width:min(calc(100% - 36px),var(--shell))}
  .hero{padding:112px 0 76px}
  .hero-grid{grid-template-columns:1fr;gap:44px}
  .hero-copy{max-width:760px}
  .hero-copy h1{max-width:11ch;font-size:clamp(3.8rem,9vw,5.8rem);line-height:.94}
  .hero-lead{max-width:650px;font-size:1rem;line-height:1.7}
  .hero-actions{margin-top:28px;flex-wrap:wrap}
  .hero-visual{width:min(100%,720px);max-width:720px;min-height:560px;justify-self:start;margin:0}
  .hero-image-main{width:78%;height:420px}
  .hero-image-small{width:48%;height:290px;border-width:10px}
  .hero-caption{left:18px;bottom:54px;width:min(320px,68%);min-width:0}
  .intro,.team-section,.areas-section,.choice-section,.pricing-section,.contact-section{padding:96px 0}
  .intro-grid{grid-template-columns:44px 1fr;gap:24px}
  .intro-copy{grid-column:2;padding-top:0;max-width:700px}
  .intro-title h2,.section-head h2,.areas-heading h2,.choice-grid h2,.pricing-grid h2,.contact-grid h2{font-size:clamp(2.9rem,7vw,4.4rem)}
  .section-head{grid-template-columns:1fr;gap:20px;margin-bottom:40px}
  .section-head>p{max-width:650px}
  .person{grid-template-columns:130px 1fr;gap:24px;align-items:start}
  .person-photo{width:130px;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center top}
  .person-meta{grid-column:2;flex-direction:row;flex-wrap:wrap;gap:8px 14px}
  .areas-grid,.choice-grid,.pricing-grid,.contact-grid{grid-template-columns:1fr;gap:42px}
  .choice-grid>div:last-child{padding-top:0}
  .areas-list>div{grid-template-columns:44px .9fr 1.1fr;gap:18px}
  .booking-panel{max-width:640px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
  .footer-grid>div:first-child{grid-column:1/-1}
}

@media (max-width:650px){
  .shell{width:calc(100% - 28px)}
  .site-header{height:64px}
  .header-inner{min-height:64px}
  .brand strong{font-size:1rem}
  .brand span{display:none}
  .menu-toggle{min-width:66px;min-height:35px;padding:0 12px;font-size:.64rem}
  .site-header .nav{top:64px!important;height:calc(100dvh - 64px)!important;padding:16px 16px max(26px,env(safe-area-inset-bottom))!important}
  .site-header .nav a{min-height:54px;font-size:1.42rem!important}
  .hero{padding:92px 0 58px}
  .hero-grid{gap:30px}
  .eyebrow{margin-bottom:14px;font-size:.6rem}
  .hero-copy h1{max-width:none;font-size:clamp(2.9rem,12vw,4.1rem);line-height:.96;margin-bottom:22px}
  .hero-lead{font-size:.94rem}
  .hero-actions{flex-direction:column;align-items:stretch;gap:12px;margin-top:24px}
  .hero-actions .btn{width:100%}
  .hero-actions .text-link{align-self:flex-start;padding:7px 0}
  .hero-visual{min-height:390px;max-width:100%}
  .hero-image-main{width:84%;height:300px}
  .hero-image-small{width:52%;height:190px;border-width:7px}
  .hero-caption{left:12px;bottom:26px;width:72%;padding:13px 14px}
  .hero-caption strong{font-size:.98rem}
  .intro,.team-section,.areas-section,.choice-section,.pricing-section,.contact-section{padding:72px 0}
  .intro-grid{grid-template-columns:1fr;gap:18px}
  .section-number{display:none}
  .intro-copy{grid-column:auto}
  .intro-title h2,.section-head h2,.areas-heading h2,.choice-grid h2,.pricing-grid h2,.contact-grid h2{font-size:clamp(2.5rem,11vw,3.45rem);line-height:1}
  .section-head{margin-bottom:30px}
  .person{grid-template-columns:82px 1fr;gap:16px;padding:20px 0}
  .person-photo{width:82px;border-radius:10px}
  .person-main h3{font-size:1.55rem;margin-bottom:8px}
  .person-role{margin-bottom:5px;font-size:.58rem}
  .person-main p:last-child{font-size:.86rem;line-height:1.6}
  .person-meta{grid-column:1/-1;margin-top:0;padding-left:98px;flex-direction:row;flex-wrap:wrap;gap:7px 12px;font-size:.68rem}
  .person-meta a{margin-top:0}
  .areas-list>div{grid-template-columns:34px 1fr;gap:12px;padding:22px 0}
  .areas-list p{grid-column:2;font-size:.9rem}
  .areas-list h3{font-size:1.35rem}
  .choice-grid>div:last-child p{font-size:.94rem}
  .pricing-list>div{grid-template-columns:1fr auto;gap:4px 12px;padding:20px 0}
  .pricing-list span{font-size:.92rem}
  .pricing-list strong{font-size:1.45rem}
  .pricing-list small{grid-column:1/-1}
  .contact-grid{gap:34px}
  .contact-grid>div>p:not(.eyebrow){font-size:.94rem}
  .contact-data{margin-top:28px}
  .contact-data div{grid-template-columns:1fr;gap:4px;padding:12px 0}
  .booking-panel{padding:28px 22px}
  .booking-panel h3{margin:32px 0 12px;font-size:2.15rem}
  .booking-panel>p:not(.eyebrow){margin-bottom:24px;font-size:.92rem}
  .site-footer{padding:36px 0 20px}
  .footer-grid{grid-template-columns:1fr;gap:22px}
  .footer-grid>div:first-child{grid-column:auto}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:6px}
  .demo-bar .shell{flex-direction:column;align-items:flex-start;gap:7px}
}

@media (max-width:390px){
  .shell{width:calc(100% - 20px)}
  .hero-copy h1{font-size:2.7rem}
  .hero-visual{min-height:340px}
  .hero-image-main{height:260px}
  .hero-image-small{height:165px}
  .hero-caption{width:76%;bottom:18px}
  .person{grid-template-columns:72px 1fr;gap:13px}
  .person-photo{width:72px}
  .person-meta{padding-left:85px}
  .pricing-list>div{grid-template-columns:1fr}
  .pricing-list small{grid-column:auto}
}