@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Manrope:wght@400;500;600;700&display=swap');

:root{
  --stone: #F1EEE6;
  --stone-dark: #E4DECE;
  --ink: #262421;
  --ink-soft: #55504A;
  --charcoal: #211F1D;
  --brass: #93703F;
  --brass-dark: #7A5C31;
  --sage: #49584F;
  --line: #D6CEBC;
  --white: #FFFFFF;
  --radius: 2px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--stone);
  color:var(--ink);
  font-family:'Manrope',sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Fraunces',serif;
  font-weight:500;
  color:var(--charcoal);
  margin:0 0 .5em;
  line-height:1.15;
}
h1{font-size:clamp(2.1rem,4.6vw,3.4rem); font-weight:400;}
h2{font-size:clamp(1.6rem,3vw,2.3rem);}
h3{font-size:1.25rem;}
p{margin:0 0 1em; color:var(--ink-soft); max-width:62ch;}
a{color:inherit;}
img{max-width:100%; display:block;}
.skip-link{position:fixed; left:16px; top:12px; z-index:500; padding:10px 14px; background:var(--charcoal); color:var(--white); transform:translateY(-160%); text-decoration:none;}
.skip-link:focus{transform:translateY(0);}
:focus-visible{outline:3px solid var(--brass); outline-offset:3px;}
.container{width:100%; max-width:1180px; margin:0 auto; padding:0 24px;}

/* Header */
.site-header{
  position:sticky; top:0; z-index:50;
  background:var(--stone); border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height:76px;
}
.logo{
  font-family:'Fraunces',serif; font-size:1.25rem; color:var(--charcoal);
  text-decoration:none; letter-spacing:.01em;
}
.logo span{color:var(--brass);}
.nav{display:flex; gap:28px; list-style:none; margin:0; padding:0;}
.nav a{
  text-decoration:none; font-size:.94rem; color:var(--ink);
  padding:6px 0; border-bottom:1px solid transparent;
}
.nav a:hover, .nav a.active{border-bottom-color:var(--brass); color:var(--charcoal);}
.nav-phone{
  font-family:'Fraunces',serif; font-size:1.05rem; text-decoration:none; color:var(--charcoal);
  white-space:nowrap;
}
.nav-toggle{display:none; background:none; border:0; cursor:pointer; padding:8px;}
.nav-toggle span{display:block; width:24px; height:2px; background:var(--charcoal); margin:5px 0;}

@media (max-width:860px){
  .nav{
    position:fixed; inset:76px 0 0 0; background:var(--stone);
    flex-direction:column; padding:32px 24px; gap:4px;
    transform:translateX(100%); transition:transform .25s ease;
    overflow-y:auto;
  }
  .nav.open{transform:translateX(0);}
  .nav a{font-size:1.15rem; padding:14px 0; border-bottom:1px solid var(--line);}
  .nav-toggle{display:block;}
  .nav-phone{display:none;}
}

/* Hero */
.hero{
  display:grid; grid-template-columns:1.05fr .95fr; align-items:stretch;
  border-bottom:1px solid var(--line);
}
.hero-text{
  display:flex; flex-direction:column; justify-content:center;
  padding:64px 48px; gap:18px;
}
.hero-eyebrow{color:var(--brass); font-size:.9rem; font-weight:600; letter-spacing:.02em;}
.hero-photo{position:relative; overflow:hidden; min-height:380px;}
.hero-photo img{width:100%; height:100%; object-fit:cover;}
.hero-compact{grid-template-columns:1fr; padding:0;}
.hero-compact .hero-text{max-width:760px; padding-top:44px; padding-bottom:44px;}
.contact-section{padding-top:32px;}
@media (max-width:860px){
  .hero{grid-template-columns:1fr;}
  .hero-text{padding:40px 24px 32px; order:2;}
  .hero-photo{order:1; min-height:320px;}
}

.btn{
  display:inline-block; background:var(--charcoal); color:var(--white);
  text-decoration:none; padding:14px 26px; font-size:.95rem; font-weight:600;
  border:1px solid var(--charcoal); transition:background .15s, color .15s;
}
.btn:hover{background:var(--brass); border-color:var(--brass);}
.btn-outline{
  background:transparent; color:var(--charcoal); border:1px solid var(--charcoal);
}
.btn-outline:hover{background:var(--charcoal); color:var(--white);}
.btn-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:6px;}
.contact-assurance{
  max-width:680px; margin:0; padding-left:14px; border-left:2px solid var(--brass);
  color:var(--ink-soft); font-size:.92rem; line-height:1.55;
}

/* Sections */
section{padding:72px 0;}
.section-tight{padding:48px 0;}
.section-dark{background:var(--charcoal); color:var(--stone);}
.section-dark h2, .section-dark h3{color:var(--white);}
.section-dark p{color:#C9C3B8;}
.section-head{max-width:640px; margin-bottom:40px;}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:36px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
@media (max-width:860px){
  .grid-3{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr; gap:28px;}
}

.service-card{border-top:2px solid var(--brass); padding-top:20px;}
.service-card .num{font-family:'Fraunces',serif; color:var(--line); font-size:1rem; display:block; margin-bottom:10px;}
.service-card a{text-decoration:none; color:var(--brass); font-size:.92rem; font-weight:600;}

.stat-row{display:flex; gap:56px; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:32px; margin-top:8px;}
.stat b{font-family:'Fraunces',serif; font-size:2rem; display:block; color:var(--charcoal);}
.stat span{font-size:.88rem; color:var(--ink-soft);}
.section-dark .stat b{color:var(--white);}
.section-dark .stat span{color:#B8B0A2;}
.section-dark .stat-row{border-top-color:#3B3833;}

/* Photo grid — bento layout */
.photo-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:150px;
  gap:12px;
}
.photo-grid a{overflow:hidden; display:block; position:relative; grid-column:span 1; grid-row:span 1;}
.photo-grid img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease;}
.photo-grid a:hover img{transform:scale(1.04);}
.photo-grid .big{grid-column:span 2; grid-row:span 2;}
.photo-grid .wide{grid-column:span 2; grid-row:span 1;}
.photo-grid .tall{grid-column:span 1; grid-row:span 2;}
@media (max-width:860px){
  .photo-grid{grid-template-columns:repeat(3,1fr); grid-auto-rows:120px;}
}
@media (max-width:600px){
  .photo-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:130px;}
  .photo-grid .big{grid-column:span 2; grid-row:span 2;}
  .photo-grid .wide{grid-column:span 2; grid-row:span 1;}
  .photo-grid .tall{grid-column:span 1; grid-row:span 2;}
}

/* Service bento (главная — три направления) */
.service-bento{
  display:grid;
  grid-template-columns:1.3fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:16px;
  min-height:560px;
}
.service-tile{
  position:relative; overflow:hidden; display:flex; flex-direction:column;
  justify-content:flex-end; padding:30px; text-decoration:none; color:var(--white);
}
.service-tile img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transition:transform .4s ease;
}
.service-tile:hover img{transform:scale(1.05);}
.service-tile::after{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(33,31,29,0) 25%, rgba(28,26,24,.92) 100%);
}
.service-tile > *{position:relative; z-index:2;}
.service-tile .num{color:var(--brass); font-family:'Fraunces',serif; font-size:1rem; display:block; margin-bottom:8px;}
.service-tile h3{color:var(--white); margin-bottom:8px;}
.service-tile p{color:#DFD8C9; margin-bottom:14px; font-size:.92rem; max-width:44ch;}
.service-tile .tile-link{color:var(--brass); font-size:.88rem; font-weight:600;}
.tile-first{grid-row:span 2;}
@media (max-width:860px){
  .service-bento{grid-template-columns:1fr; grid-template-rows:none; min-height:0;}
  .tile-first{grid-row:span 1;}
  .service-tile{min-height:320px;}
}

/* Steps */
.steps{list-style:none; margin:0; padding:0; border-top:1px solid var(--line);}
.steps li{
  display:grid; grid-template-columns:64px 1fr; gap:24px;
  padding:26px 0; border-bottom:1px solid var(--line);
}
.steps .step-n{font-family:'Fraunces',serif; color:var(--brass); font-size:1.3rem;}
.steps h3,.steps h4{margin-bottom:6px;}
.terms-note{margin-top:18px; font-size:.92rem;}

/* Filter */
.filter-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:32px;}
.filter-btn{
  background:transparent; border:1px solid var(--line); color:var(--ink);
  padding:9px 18px; font-size:.88rem; cursor:pointer; font-family:'Manrope',sans-serif;
}
.filter-btn.active{background:var(--charcoal); border-color:var(--charcoal); color:var(--white);}
.filter-btn[aria-pressed="true"]{background:var(--charcoal); border-color:var(--charcoal); color:var(--white);}

/* Portfolio cases */
.case-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:64px;}
.case-card{background:var(--white); border:1px solid var(--line);}
.case-photo{display:block; aspect-ratio:4/3; overflow:hidden;}
.case-photo img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease;}
.case-photo:hover img{transform:scale(1.035);}
.case-copy{padding:24px;}
.case-label{display:block; margin-bottom:10px; color:var(--brass-dark); font-size:.78rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;}
.case-copy h3{font-size:1.35rem;}
.case-copy p{font-size:.92rem;}
.case-list{margin:18px 0 0; padding:16px 0 0; border-top:1px solid var(--line); list-style:none; display:flex; flex-direction:column; gap:7px; color:var(--ink-soft); font-size:.86rem;}
.case-list li::before{content:'✓'; color:var(--brass-dark); margin-right:8px; font-weight:700;}
.gallery-head{margin-bottom:24px;}
@media (max-width:860px){.case-grid{grid-template-columns:1fr;}.case-card{display:grid; grid-template-columns:minmax(220px,.8fr) 1fr;}.case-photo{aspect-ratio:auto; min-height:280px;}}
@media (max-width:600px){.case-card{display:block;}.case-photo{aspect-ratio:4/3; min-height:0;}}

/* Lightbox */
.lightbox{
  position:fixed; inset:0; background:rgba(20,18,16,.94); display:none;
  align-items:center; justify-content:center; z-index:200; padding:24px;
}
.lightbox.open{display:flex;}
.lightbox img{max-width:92vw; max-height:88vh; object-fit:contain;}
.lightbox-close{
  position:absolute; top:22px; right:28px; color:var(--white); font-size:2rem;
  background:none; border:0; cursor:pointer; line-height:1;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition-duration:.01ms!important; animation-duration:.01ms!important;}
}

/* Contact form */
.form-block label{display:block; font-size:.88rem; color:var(--ink-soft); margin-bottom:6px;}
.form-block input, .form-block textarea, .form-block select{
  width:100%; padding:13px 14px; border:1px solid var(--line); background:var(--white);
  font-family:'Manrope',sans-serif; font-size:1rem; margin-bottom:18px; color:var(--ink);
}
.form-block input:focus, .form-block textarea:focus, .form-block select:focus{outline:1px solid var(--brass); border-color:var(--brass);}
.form-block select{width:100%; background:var(--white); padding:13px 12px; border:1px solid var(--line); border-radius:0;}
.consent-row{display:flex!important; align-items:flex-start; gap:10px; margin:4px 0 18px; font-size:.82rem!important; line-height:1.45;}
.consent-row input{width:18px!important; height:18px; margin:2px 0 0!important; flex:0 0 auto;}
.form-note{font-size:.8rem; margin-top:12px; color:var(--ink-soft);}
.form-trap{position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important;}
.form-status{min-height:24px; margin-top:14px; font-size:.92rem; font-weight:600;}
.form-status.success{color:#2F6544;}
.form-status.error{color:#8A3529;}
.form-status a{color:inherit;}
.form-block .btn:disabled{opacity:.65; cursor:wait;}
.legal{max-width:850px;}
.legal h2{margin-top:40px; font-size:clamp(1.5rem,3vw,2.2rem);}
.legal ul{padding-left:22px;}
.legal li{margin-bottom:8px;}

.trust-strip{
  display:flex; gap:40px; flex-wrap:wrap; padding:28px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.trust-strip div{max-width:220px;}
.trust-strip b{display:block; font-family:'Fraunces',serif; font-size:1.05rem; margin-bottom:4px; color:var(--charcoal);}
.trust-strip span{font-size:.87rem; color:var(--ink-soft);}

/* Footer */
.site-footer{background:var(--charcoal); color:#C9C3B8; padding:48px 0 28px;}
.site-footer .container{display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px;}
.site-footer a{color:#C9C3B8; text-decoration:none;}
.site-footer a:hover{color:var(--white);}
.footer-col h4{color:var(--white); font-size:1rem; margin-bottom:12px;}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:.9rem;}
.footer-bottom{
  border-top:1px solid #3B3833; margin-top:36px; padding-top:20px; font-size:.82rem; color:#8B8577;
}
.footer-bottom .container{justify-content:space-between;}

.pill{
  display:inline-block; font-size:.8rem; color:var(--brass); border:1px solid var(--brass);
  padding:4px 12px; margin-bottom:14px;
}