/* =========================================================
   GIFT CONCIERGE SERVICE — design tokens
   Ink + brass: a quiet, ledger-like palette for a bespoke
   corporate-gift house. Serif for voice, mono for record-
   keeping (numbers, labels, contacts), hairlines throughout
   as the one recurring structural device.
   ========================================================= */
:root {
    --ink: #0b0a08;
    --ink-soft: #141210;
    --paper: #ece6d8;
    --muted: #8c8577;
    --muted-soft: #5c584d;
    --brass: #c9a24c;
    --brass-wash: rgba(201,162,76,.07);
    --hairline: rgba(236,230,216,.08);
    --hairline-strong: rgba(236,230,216,.16);

    --font-display: 'Century Gothic', CenturyGothic, 'Jost', sans-serif;
    --font-body: 'Century Gothic', CenturyGothic, 'Jost', sans-serif;
    --font-mono: 'Century Gothic', CenturyGothic, 'Jost', sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-body); background:var(--ink); color:var(--paper); min-height:100vh; overflow-x:hidden; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; height:auto; }
.container { max-width:clamp(1400px, 82vw, 1800px); margin:0 auto; padding:0 24px; }
a { color:inherit; }
a:focus-visible, button:focus-visible { outline:2px solid var(--brass); outline-offset:4px; border-radius:2px; }

/* EYEBROW — recurring label device */
.section-eyebrow { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--brass); margin-bottom:18px; }
.section-eyebrow::before { content:''; width:22px; height:1px; background:var(--brass); }

/* HEADER — статичный, максимально чёрный, без прозрачности при загрузке */
.header { position:fixed; top:0; left:0; right:0; z-index:1000; height:85.536px; padding:0; background:var(--ink); border-bottom:1px solid var(--hairline); transition:transform .4s ease; }
.header.header-hidden { transform:translateY(-100%); }
.header .container { display:flex; justify-content:flex-start; align-items:center; height:100%; }
.logo-link { display:flex; align-items:center; text-decoration:none; transition:opacity .3s; }
.logo-link:hover { opacity:.82; }
.logo-img { height:66.096px; width:auto; display:block; }

/* HERO */
.hero { width:100%; height:100vh; position:relative; overflow:hidden; background:var(--ink-soft); }
.hero-image { width:100%; height:120%; position:relative; top:-10%; will-change:transform; }
.hero-image img { width:100%; height:100%; object-fit:cover; }
.hero-image::after { content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(11,10,8,.92) 0%, rgba(11,10,8,.12) 42%, rgba(11,10,8,.3) 100%); }
.hero-caption { position:absolute; bottom:104px; left:50%; transform:translateX(-50%); text-align:center; color:var(--paper); z-index:2; width:90%; max-width:760px; }
.hero-eyebrow { display:block; font-family:var(--font-mono); font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--brass); margin-bottom:22px; text-shadow:0 2px 12px rgba(0,0,0,.7), 0 0 24px rgba(0,0,0,.5); }
.hero-caption h2 { font-family:var(--font-display); font-weight:500; font-size:clamp(32px,5vw,56px); letter-spacing:-.5px; line-height:1.16; margin-bottom:32px; text-shadow:0 8px 40px rgba(0,0,0,.5); }
.scroll-cue { display:inline-flex; flex-direction:column; align-items:center; gap:10px; font-family:var(--font-mono); font-size:13px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--paper); text-shadow:0 2px 12px rgba(0,0,0,.7), 0 0 24px rgba(0,0,0,.5); }
.scroll-cue span { width:1px; height:34px; background:linear-gradient(to bottom, var(--brass), transparent); animation:scrollLine 2.2s ease-in-out infinite; }
@keyframes scrollLine {
    0%   { transform:scaleY(0); transform-origin:top; opacity:0; }
    40%  { transform:scaleY(1); transform-origin:top; opacity:1; }
    60%  { transform:scaleY(1); transform-origin:bottom; opacity:1; }
    100% { transform:scaleY(0); transform-origin:bottom; opacity:0; }
}
.hero-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:var(--ink-soft); }
.hero-empty { text-align:center; color:var(--muted-soft); }
.hero-empty p { font-family:var(--font-display); font-size:24px; font-weight:300; }

/* CORPORATE */
.corporate-section { padding:140px 0 56px; background:var(--ink); }
.corporate-head { max-width:720px; margin-bottom:0; }
.corporate-title { font-family:var(--font-display); font-weight:400; font-size:clamp(30px,4vw,44px); letter-spacing:-.5px; color:var(--paper); margin-bottom:18px; line-height:1.22; }
.corporate-subtitle { font-size:17px; font-weight:300; color:var(--muted); line-height:1.7; max-width:640px; }

.philosophy-list { display:flex; flex-direction:column; border-top:1px solid var(--hairline); background:var(--ink); }
.philosophy-block { position:relative; display:flex; align-items:center; min-height:560px; border-bottom:1px solid var(--hairline); overflow:hidden; opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
.philosophy-block.visible { opacity:1; transform:translateY(0); }
.philosophy-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s ease, filter .8s ease; filter:saturate(.94); }
.philosophy-block:hover .philosophy-image { transform:scale(1.035); filter:saturate(1.05); }
.philosophy-image-empty { display:flex; align-items:center; justify-content:center; color:var(--muted-soft); font-family:var(--font-mono); letter-spacing:.05em; text-transform:uppercase; font-size:14px; background:var(--ink-soft); }
.philosophy-block::after { content:''; position:absolute; inset:0; background:linear-gradient(to right, rgba(11,10,8,.94) 0%, rgba(11,10,8,.72) 30%, rgba(11,10,8,.18) 58%, transparent 78%); pointer-events:none; }
.philosophy-text { position:relative; z-index:2; width:min(480px, 46%); display:flex; flex-direction:column; justify-content:center; padding:48px clamp(24px,4vw,64px); }
.philosophy-index { font-family:var(--font-mono); font-size:14px; letter-spacing:.08em; color:var(--brass); margin-bottom:14px; }
.philosophy-text h3 { font-family:var(--font-display); font-size:26px; font-weight:600; color:var(--paper); margin-bottom:16px; line-height:1.25; text-shadow:0 2px 20px rgba(0,0,0,.4); }
.philosophy-text p { font-size:16px; font-weight:500; color:var(--muted); line-height:1.75; text-shadow:0 2px 16px rgba(0,0,0,.35); }

/* PORTFOLIO / MARQUEE FILMSTRIP */
.content-wrapper { background:var(--ink); border-top:1px solid var(--hairline); }
.portfolio-head { padding:12px 0 56px; }
.portfolio-title { font-family:var(--font-display); font-weight:400; font-size:clamp(26px,3.4vw,38px); color:var(--paper); letter-spacing:-.3px; }

.marquee-slider { width:100%; overflow:hidden; margin-bottom:3px; display:flex; cursor:grab; touch-action:pan-y; user-select:none; -webkit-user-select:none; }
.marquee-slider.dragging { cursor:grabbing; }
.marquee-slider.dragging img { cursor:grabbing; }
.marquee-slider img { -webkit-user-drag:none; user-drag:none; }
.marquee-slider:last-child { margin-bottom:0; }
.marquee-track { display:flex; gap:0; width:max-content; will-change:transform; }
.marquee-slide { flex-shrink:0; width:600px; height:420px; position:relative; overflow:hidden; background:var(--ink-soft); box-shadow:inset 1px 0 0 var(--hairline); }
.marquee-slide img { width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.94); transition:transform .7s ease, filter .7s ease; cursor:zoom-in; }
.marquee-slide:hover img { transform:scale(1.035); filter:saturate(1.06); }
.marquee-slide .slide-caption { position:absolute; bottom:0; left:0; right:0; padding:22px 24px; background:linear-gradient(transparent, rgba(11,10,8,.85)); color:var(--paper); }
.marquee-slide .slide-caption p { font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase; margin:0; }
.marquee-slide.empty { display:flex; align-items:center; justify-content:center; color:var(--muted-soft); font-size:16px; background:var(--ink-soft); font-family:var(--font-mono); letter-spacing:.05em; text-transform:uppercase; }

/* FOOTER */
.footer { padding:56px 0 34px; border-top:1px solid var(--hairline); background:var(--ink); }
.footer-content { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-bottom:30px; border-bottom:1px solid var(--hairline); margin-bottom:26px; }
.footer-logo-left { display:flex; justify-content:flex-start; }
.footer-logo-img { height:52px; width:auto; opacity:.85; }
.footer-contacts { display:flex; flex-direction:column; gap:10px; align-items:flex-end; }
.footer-contact-item { display:flex; align-items:center; gap:12px; font-family:var(--font-mono); font-size:20px; color:var(--muted); }
.footer-contact-label { color:var(--muted-soft); min-width:52px; text-align:right; text-transform:uppercase; letter-spacing:.08em; font-size:14px; }
.footer-contact-link { color:var(--paper); font-weight:600; text-decoration:none; border-bottom:1px solid transparent; transition:color .3s, border-color .3s; }
.footer-contact-link:hover { color:var(--brass); border-bottom-color:var(--brass); }
.footer-bottom { text-align:center; font-family:var(--font-mono); font-size:11px; letter-spacing:.05em; color:var(--muted-soft); }

/* SCROLL TOP */
.scroll-top { position:fixed; bottom:40px; right:40px; width:52px; height:52px; border-radius:50%; background:rgba(236,230,216,.04); backdrop-filter:blur(12px); border:1px solid var(--hairline-strong); color:var(--paper); cursor:pointer; opacity:0; visibility:hidden; transform:translateY(20px) scale(.9); transition:all .4s ease; z-index:999; display:flex; align-items:center; justify-content:center; }
.scroll-top.show { opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.scroll-top:hover { border-color:var(--brass); color:var(--brass); background:var(--brass-wash); }
.scroll-top svg { stroke:currentColor; stroke-width:2; width:22px; height:22px; }

/* LIGHTBOX — увеличенный просмотр фото из слайдера */
.lightbox { position:fixed; inset:0; z-index:2000; background:rgba(6,5,4,.94); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; padding:5vw; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility 0s linear .3s; }
.lightbox.show { opacity:1; visibility:visible; transition:opacity .3s ease; }
.lightbox-img { max-width:90vw; max-height:90vh; width:auto; height:auto; object-fit:contain; box-shadow:0 30px 80px rgba(0,0,0,.6); transform:scale(.96); transition:transform .3s ease; }
.lightbox.show .lightbox-img { transform:scale(1); }
.lightbox-close { position:fixed; top:28px; right:28px; width:48px; height:48px; border-radius:50%; background:rgba(236,230,216,.06); border:1px solid var(--hairline-strong); color:var(--paper); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:border-color .3s, color .3s, background-color .3s; }
.lightbox-close:hover { border-color:var(--brass); color:var(--brass); background:var(--brass-wash); }
.lightbox-download { position:fixed; top:28px; right:88px; height:48px; padding:0 20px; border-radius:999px; background:rgba(236,230,216,.06); border:1px solid var(--hairline-strong); color:var(--paper); cursor:pointer; display:flex; align-items:center; gap:9px; font-family:var(--font-mono); font-size:13px; letter-spacing:.05em; text-transform:uppercase; transition:border-color .3s, color .3s, background-color .3s; }
.lightbox-download:hover { border-color:var(--brass); color:var(--brass); background:var(--brass-wash); }
.lightbox-download:disabled { opacity:.5; cursor:wait; }
@media (max-width:640px) {
    .lightbox-download span { display:none; }
    .lightbox-download { right:84px; width:48px; padding:0; justify-content:center; }
}

/* ADAPTIVE */
@media (max-width:900px) {
    .philosophy-text { width:min(420px, 55%); }
}
@media (max-width:768px) {
    .marquee-slide { width:400px; height:280px; }
    .corporate-section { padding:100px 0 40px; }
    .portfolio-head { padding:8px 0 40px; }
    .footer-content { flex-direction:column; text-align:center; gap:20px; }
    .footer-logo-left { justify-content:center; }
    .footer-contacts { align-items:center; }
    .philosophy-block { min-height:420px; align-items:flex-end; }
    .philosophy-block::after { background:linear-gradient(to top, rgba(11,10,8,.95) 0%, rgba(11,10,8,.55) 45%, transparent 85%); }
    .philosophy-text { width:auto; padding:28px clamp(20px,5vw,32px) 32px; }
}
@media (max-width:640px) {
    .header { height:57.024px; padding:0; }
    .logo-img { height:44.064px; }
    .hero-caption { bottom:64px; }
}
@media (max-width:480px) {
    .marquee-slide { width:280px; height:200px; }
}

/* MOTION & ACCESSIBILITY FLOOR */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    .scroll-cue span { animation:none; opacity:.6; transform:none; }
    * { transition-duration:.001ms !important; animation-duration:.001ms !important; }
}