:root{
    --ink:#232220;
    --ink-soft:#5c5a54;
    --paper:#faf8f4;
    --cream:#efe9df;
    --clay:#b5694f;
    --hairline:rgba(35,34,32,0.12);
    --hairline-strong:rgba(35,34,32,0.22);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
    font-family:'Manrope',sans-serif;
    color:var(--ink);
    background:var(--paper);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden; /* страхует от горизонтального скролла на мобильных из-за случайного переполнения */
    -webkit-tap-highlight-color:transparent;
}
img{max-width:100%;}
.serif{font-family:'Cormorant Garamond',serif;}
.eyebrow{
    display:inline-block;
    font-size:12px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--clay);
    margin-bottom:.9rem;
}

/* ===== INTRO ===== */
#intro{
    position:fixed;
    inset:0;
    background:var(--paper);
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:99999;
    transition:opacity 1.6s ease, transform 2s ease;
}
.intro-content{
    text-align:center;
    transform:translateY(20px);
    opacity:0;
    animation:introText 1.6s ease forwards;
}
.intro-logo{
    font-family:'Cormorant Garamond',serif;
    font-size:56px;
    font-weight:500;
    letter-spacing:1px;
    color:var(--ink);
}
.intro-subtitle{
    margin-top:14px;
    font-size:13px;
    letter-spacing:4px;
    text-transform:uppercase;
    color:var(--ink-soft);
}
@keyframes introText{
    from{opacity:0;transform:translateY(25px);}
    to{opacity:1;transform:translateY(0);}
}
body.loaded #intro{
    opacity:0;
    transform:scale(1.05);
    pointer-events:none;
}

/* ===== HERO ===== */
.cover{
    position:relative;
    width:100%;
    height:100vh;
    height:100svh; /* устойчивая высота на мобильных — без "прыжка" от адресной строки */
    overflow:hidden;
    opacity:0;
    transform:scale(1.03);
    transition:opacity 2s ease, transform 2.4s ease;
}
.cover-image{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;}
.cover-image img{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;object-position:center 30%;display:block;
    filter:grayscale(1) contrast(1.05);
}
.cover::after{
    content:"";
    position:absolute;inset:0;
    background:linear-gradient(to right, rgba(0,0,0,0) 30%, rgba(0,0,0,.25) 62%, rgba(0,0,0,.55) 100%);
    pointer-events:none;
}
.cover-info{
    position:absolute;inset:0;z-index:2;
    display:flex;flex-direction:column;justify-content:center;align-items:flex-end;
    padding-right:9vw;text-align:right;
}
.cover-eyebrow{
    font-size:13px;letter-spacing:.14em;text-transform:uppercase;
    color:rgba(243,241,236,.75);margin-bottom:1.4rem;
}
.cover-name{
    font-weight:500;font-size:clamp(48px,7vw,88px);line-height:.98;
    margin-bottom:1.4rem;color:#F3F1EC;text-shadow:0 2px 16px rgba(0,0,0,.4);
}
.cover-tagline{
    font-size:16px;line-height:1.55;color:rgba(243,241,236,.85);
    margin-bottom:2.2rem;max-width:360px;
}
.cover-actions{display:flex;gap:1rem;flex-wrap:wrap;justify-content:flex-end;}
.btn-primary{
    display:inline-block;background:#000;color:#fff;border:none;
    font-family:'Manrope',sans-serif;font-size:14px;font-weight:500;
    padding:.95rem 1.7rem;border-radius:2px;cursor:pointer;text-decoration:none;
    transition:opacity .15s ease, transform .15s ease;
}
.btn-primary:hover{opacity:.88;transform:translateY(-1px);}
.btn-ghost{
    background:#000;color:#fff;border:1px solid #000;
    font-family:'Manrope',sans-serif;font-size:14px;font-weight:500;
    padding:.9rem 1.6rem;border-radius:2px;cursor:pointer;
    transition:opacity .15s ease;
}
.btn-ghost:hover{opacity:.88;}
.scroll-cue{
    position:absolute;bottom:2.2rem;left:50%;transform:translateX(-50%);
    color:#fff;cursor:pointer;background:none;border:none;z-index:2;
    animation:bob 2.2s ease-in-out infinite;
}
@keyframes bob{
    0%,100%{transform:translate(-50%,0);}
    50%{transform:translate(-50%,6px);}
}
@media (max-width:820px){
    .cover-info{align-items:flex-start;text-align:left;padding:0 1.5rem;}
    .cover-actions{justify-content:flex-start;}
}

/* ===== ABOUT ===== */
.about{padding:7rem 2.5rem;background:var(--paper);}
.about-wrap{
    max-width:1200px;margin:0 auto;
    display:grid;grid-template-columns:.85fr 1.15fr;gap:4.5rem;align-items:center;
}
.about-photo{aspect-ratio:4/5;overflow:hidden;background:var(--cream);}
.about-photo img{width:100%;height:100%;object-fit:cover;filter:sepia(.08) saturate(.92);}
.about-text h2{font-size:clamp(28px,3.2vw,40px);line-height:1.15;margin-bottom:1.5rem;}
.about-text p{font-size:15.5px;line-height:1.75;color:var(--ink-soft);margin-bottom:1.1rem;max-width:52ch;}
.about-stats{display:flex;gap:2.6rem;margin-top:2rem;}
.about-stats div{display:flex;flex-direction:column;}
.about-stats .num{font-size:34px;color:var(--clay);line-height:1;}
.about-stats .label{font-size:12.5px;color:var(--ink-soft);margin-top:.4rem;}
@media (max-width:820px){
    .about{padding:4.5rem 1.4rem;}
    .about-wrap{grid-template-columns:1fr;gap:2.2rem;}
}

/* ===== PORTFOLIO ===== */
.portfolio{background:var(--cream);padding:6rem 0 6.5rem;}
.portfolio-header{max-width:1400px;margin:0 auto;padding:0 2.5rem 2.4rem;}
.portfolio-header h2{font-size:clamp(28px,3.2vw,38px);margin-bottom:1.6rem;}
.tabs{display:flex;gap:2rem;border-bottom:1px solid var(--hairline);}
.tab{
    background:none;border:none;font-family:'Manrope',sans-serif;font-size:14.5px;
    color:var(--ink-soft);padding-bottom:1rem;cursor:pointer;
    border-bottom:2px solid transparent;transition:color .15s ease;
}
.tab.active{color:var(--ink);border-bottom-color:var(--clay);}
.tab:hover{color:var(--ink);}
.grid{
    max-width:1400px;margin:2rem auto 0;padding:0 2.5rem;
    display:grid;grid-template-columns:repeat(3,1fr);gap:2px;
}
.photo{position:relative;aspect-ratio:3/4;overflow:hidden;background:#e3dccd;cursor:pointer;}
.photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;filter:sepia(.1) saturate(.9) brightness(1.02);}
.photo:hover img{transform:scale(1.035);}
.photo .frame-no{
    position:absolute;top:12px;left:14px;font-family:'Manrope',sans-serif;
    font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.85);
    opacity:0;transition:opacity .2s ease;
}
.photo:hover .frame-no{opacity:1;}
.photo.hidden{display:none;}
@media (max-width:900px){
    .grid{grid-template-columns:repeat(2,1fr);padding:0 1.2rem;}
    .portfolio-header{padding:0 1.2rem 2rem;}
}
@media (max-width:560px){
    .grid{grid-template-columns:1fr;}
    .tabs{gap:1.2rem;}
}

/* ===== SERVICES ===== */
.services{padding:7rem 2.5rem;background:var(--paper);}
.services-header{max-width:1200px;margin:0 auto 3rem;}
.services-header h2{font-size:clamp(28px,3.2vw,38px);}
.services-grid{
    max-width:1200px;margin:0 auto;
    display:grid;grid-template-columns:repeat(3,1fr);gap:2.4rem;
}
.service-card{border-top:1px solid var(--hairline-strong);padding-top:1.6rem;}
.service-frame{font-size:12px;letter-spacing:.1em;color:var(--clay);margin-bottom:1rem;}
.service-card h3{font-size:22px;margin-bottom:.8rem;}
.service-card p{font-size:14.5px;line-height:1.65;color:var(--ink-soft);margin-bottom:1.2rem;}
.service-price{font-size:13.5px;color:var(--ink);font-weight:500;}
@media (max-width:900px){
    .services{padding:4.5rem 1.4rem;}
    .services-grid{grid-template-columns:1fr;gap:2.2rem;}
}

/* ===== CLIENT CTA ===== */
.client-cta{background:var(--ink);color:var(--paper);padding:6rem 2.5rem;text-align:center;}
.client-cta .eyebrow{color:#d99a85;}
.client-cta-wrap{max-width:560px;margin:0 auto;}
.client-cta h2{font-size:clamp(26px,3.2vw,36px);margin-bottom:1.1rem;}
.client-cta p{font-size:15px;line-height:1.65;color:rgba(250,248,244,.7);margin-bottom:2rem;}

/* ===== CONTACT ===== */
.contact{background:var(--paper);padding:6.5rem 2.5rem 2.5rem;text-align:center;}
.contact-wrap{max-width:520px;margin:0 auto;}
.contact h2{font-size:clamp(26px,3.2vw,36px);margin-bottom:1rem;}
.contact p{font-size:15px;color:var(--ink-soft);margin-bottom:1.6rem;}
.contact-links{font-size:15px;}
.contact-links a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;}
.contact-links .dot{color:var(--hairline-strong);margin:0 .6rem;}
.footer{
    margin-top:4rem;padding-top:1.6rem;border-top:1px solid var(--hairline);
    font-size:12.5px;color:var(--ink-soft);
}

/* ===== LIGHTBOX ===== */
.lightbox{
    position:fixed;inset:0;background:rgba(0,0,0,.95);
    display:flex;justify-content:center;align-items:center;
    opacity:0;visibility:hidden;transition:.3s;z-index:999999;
}
.lightbox.open{opacity:1;visibility:visible;}
.lb-image-wrap{width:100%;height:100%;overflow:hidden;display:flex;justify-content:center;align-items:center;}
.lb-image-wrap img{max-width:95%;max-height:95%;transition:transform .2s;cursor:grab;user-select:none;touch-action:none;}
.lb-close,.lb-prev,.lb-next{
    position:absolute;background:none;border:none;color:#fff;font-size:44px;cursor:pointer;z-index:5;
}
.lb-close{top:22px;right:32px;}
.lb-prev{left:22px;top:50%;transform:translateY(-50%);}
.lb-next{right:22px;top:50%;transform:translateY(-50%);}

/* ===== МОБИЛЬНАЯ АДАПТАЦИЯ (узкие экраны) ===== */
@media (max-width:480px){
    .intro-logo{font-size:38px;}
    .intro-subtitle{font-size:11px;letter-spacing:3px;}
    .cover-info{padding:0 1.2rem;}
    .cover-tagline{max-width:none;}
    .about{padding:3.5rem 1.2rem;}
    .portfolio{padding:4rem 0 4.5rem;}
    .client-cta{padding:4rem 1.5rem;}
    .contact{padding:4.5rem 1.5rem 2rem;}
    .contact-links{display:flex;flex-direction:column;gap:.8rem;}
    .contact-links .dot{display:none;}
    .lb-close,.lb-prev,.lb-next{font-size:32px;padding:.5rem;}
    .lb-close{top:10px;right:10px;}
    .lb-prev{left:6px;}
    .lb-next{right:6px;}
}
