@charset "UTF-8";
.skin-warm-letter {
    --warm-ivory: #fffaf3;
    --warm-rose: #c98277;
    --warm-clay: #a85f54;
    --warm-ink: #3f302c;
    --warm-muted: #725d56;
    --warm-gold: #b99055;
    background: #f6eee7;
}
.skin-warm-letter .gift-button-primary,
.skin-warm-letter .gift-button-secondary,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    min-width: 176px;
    min-height: 58px;
    align-items: center;
    justify-content: center;
    padding: 10px 34px;
    border: 0;
    background: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-primary-v2-center.webp") center / 100% 100% no-repeat;
    color: #4c302b;
    font: 700 15px/1 Manrope, sans-serif;
    text-decoration: none;
    text-wrap: nowrap;
    filter: drop-shadow(0 9px 12px rgba(91, 55, 48, .16));
    transition: filter .2s ease, transform .2s ease;
}
.skin-warm-letter .gift-button-primary::before,
.skin-warm-letter .gift-button-primary::after,
.skin-warm-letter .gift-button-secondary::before,
.skin-warm-letter .gift-button-secondary::after,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button::before,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button::after,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button::before,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button::after {
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    width: 64px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: "";
    pointer-events: none;
}
.skin-warm-letter .gift-button-primary::before { inset-inline-start: -12px; background-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-primary-v2-left.webp"); }
.skin-warm-letter .gift-button-primary::after { inset-inline-end: -12px; background-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-primary-v2-right.webp"); }
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button::before { inset-inline-start:-12px;background-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-primary-v2-left.webp"); }
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button::after { inset-inline-end:-12px;background-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-primary-v2-right.webp"); }
.skin-warm-letter .gift-button-secondary { background-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-secondary-v2-center.webp"); }
.skin-warm-letter .gift-button-secondary::before { inset-inline-start: -12px; background-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-secondary-v2-left.webp"); }
.skin-warm-letter .gift-button-secondary::after { inset-inline-end: -12px; background-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-secondary-v2-right.webp"); }
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button { background-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-secondary-v2-center.webp"); }
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button::before { inset-inline-start:-12px;background-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-secondary-v2-left.webp"); }
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button::after { inset-inline-end:-12px;background-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-button-secondary-v2-right.webp"); }
.skin-warm-letter .gift-button-primary:hover,
.skin-warm-letter .gift-button-secondary:hover,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button:hover,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button:hover {
    filter: drop-shadow(0 12px 15px rgba(91, 55, 48, .22));
    transform: translateY(-2px);
}
.skin-warm-letter .gift-button-primary:focus-visible,
.skin-warm-letter .gift-button-secondary:focus-visible,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-action button:focus-visible,
.skin-warm-letter .gift-event-rsvp .invitation-rsvp-cancel-button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--warm-clay) 52%, white);
    outline-offset: 4px;
    filter: drop-shadow(0 12px 15px rgba(91, 55, 48, .22));
}
/* Gate остаётся законченным до взаимодействия: письмо уже читаемо, а конверт
   усиливает интригу, не закрывая живой текст. */
.skin-warm-letter .gift-envelope {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
    gap: clamp(24px, 4vw, 64px);
    padding: clamp(28px, 4vw, 64px);
    background:
        linear-gradient(rgba(246, 238, 231, .18), rgba(246, 238, 231, .18)),
        radial-gradient(circle at 82% 44%, rgba(201, 130, 119, .16), transparent 32%),
        url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-gate-v1.webp") center / cover no-repeat,
        #f6eee7;
}
.gift-envelope-copy {
    position: relative;
    z-index: 2;
    max-width: 680px;
    padding: clamp(28px, 3vw, 44px);
    border: clamp(30px, 3vw, 42px) solid transparent;
    border-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-text-master-v2.webp") 86 stretch;
    background: rgba(255, 250, 243, .94);
    box-shadow: 0 30px 70px rgba(75, 48, 42, .12);
}
/* Hero собирается одной сеткой на всех ширинах; декоративная роза не участвует
   в геометрии текста и безопасно уходит на второй план при длинных данных. */
.skin-warm-letter .gift-hero,
.skin-warm-letter .gift-hero.is-art-only {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(300px, 1.05fr);
    grid-template-rows: 1fr;
    min-height: var(--hero-min-height, min(78svh, 760px));
    gap: clamp(28px, 6vw, 90px);
    padding: clamp(72px, 9vw, 128px);
    background:
        linear-gradient(118deg, rgba(255,250,243,.3), rgba(242,223,214,.22)),
        radial-gradient(circle at 78% 30%, rgba(201, 130, 119, .14), transparent 30%),
        url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-hero-v1.webp") center / cover no-repeat,
        #f2dfd6;
}
.skin-warm-letter .gift-hero::after { inset: 5%; border-radius: 4px; animation: none; }
.skin-warm-letter .gift-hero.is-art-only::after,
.skin-warm-letter .gift-hero.is-art-only .gift-hero-companion,
.skin-warm-letter .gift-hero .gift-floating-shell,
.skin-warm-letter .gift-letter-ribbon { display: none; }
.skin-warm-letter .gift-hero-copy,
.skin-warm-letter .gift-hero.is-art-only .gift-hero-copy { container-type:inline-size; grid-column: 1; grid-row: 1; align-self: center; width: auto; min-height: 0; padding: clamp(34px, 5vw, 68px); border: 44px solid transparent; border-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-text-master-v2.webp") 86 stretch; background: rgba(255,250,243,.9); text-align: start; box-shadow: 0 26px 60px rgba(75,48,42,.12); }
.skin-warm-letter .gift-hero.is-art-only .gift-hero-copy::before { display: none; }
.skin-warm-letter .gift-hero-copy h2,
.skin-warm-letter .gift-hero.is-art-only .gift-hero-copy h2 { margin:24px 0; overflow-wrap:normal; word-break:normal; hyphens:auto; text-wrap:balance; font-size:clamp(2.8rem,4.4vw,4.8rem); font-size:clamp(2.8rem,13cqi,4.8rem); }
.skin-warm-letter .gift-hero.is-art-only .gift-hero-copy h2::after { display: none; }
.skin-warm-letter .gift-hero-visual,
.skin-warm-letter .gift-hero.is-art-only .gift-hero-visual { grid-column: 2; grid-row: 1; min-height: 560px; border: 0; background: transparent; }
.skin-warm-letter .gift-hero-visual figure { inset: 8%; padding: 18px; border: 44px solid transparent; border-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-photo-master-v2.webp") 130 stretch; background: #fff; transform: rotate(1.2deg); }
.skin-warm-letter .gift-story { min-height:78svh; background:linear-gradient(145deg,rgba(238,216,206,.32),rgba(255,250,243,.16) 62%),url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-story-v1.webp") center/cover no-repeat,#fffaf3; }
.skin-warm-letter .gift-story > div:first-of-type { container-type:inline-size; padding:clamp(30px,5vw,64px); border:42px solid transparent; border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-text-master-v2.webp") 86 stretch; background:rgba(255,250,243,.9); }
.skin-warm-letter .gift-story > div:first-of-type h2 { overflow-wrap:break-word; font-size:clamp(2.6rem,4.4vw,4rem); font-size:clamp(2.6rem,11cqi,4rem); }
.skin-warm-letter .gift-gallery { background:radial-gradient(circle at 8% 12%,rgba(201,130,119,.15),transparent 24%),linear-gradient(rgba(247,233,224,.2),rgba(247,233,224,.2)),url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-gallery-v1.webp") center/cover no-repeat,#f7e9e0; }
.gift-photo-stack figure { margin: 0; padding: clamp(10px,1.2vw,16px); border: clamp(26px,3vw,42px) solid transparent; border-image: url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-photo-master-v2.webp") 130 stretch; background:#fff; box-shadow:0 24px 52px rgba(73,46,40,.14); transform:rotate(calc((var(--warm-photo-index) - 1.5) * .7deg)); transition:transform .35s ease; }
.gift-photo-track figure { flex:0 0 min(76vw,600px); margin:0; padding:10px; border:32px solid transparent; border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-photo-master-v2.webp") 130 stretch; background:#fff; scroll-snap-align:center; }
.gift-control span,.gift-sound-art { background-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-controls-atlas-v3.webp"); background-repeat:no-repeat; background-size:400% 200%; }
.skin-warm-letter .gift-work { padding:clamp(72px,9vw,130px) clamp(18px,5vw,70px); background:radial-gradient(circle at 18% 18%,rgba(201,130,119,.16),transparent 26%),linear-gradient(rgba(52,40,36,.36),rgba(52,40,36,.36)),url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-work-v1.webp") center/cover no-repeat,#493934; }
.gift-photo-frame { padding:8px; border:34px solid transparent; border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-photo-master-v2.webp") 130 stretch; background:#fff; }
.gift-text-frame { border:clamp(34px,4vw,52px) solid transparent; border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-text-master-v2.webp") 86 stretch; background:#fffaf3; color:var(--warm-ink); }
.skin-warm-letter .gift-finale { background:radial-gradient(circle at 50% 35%,rgba(201,130,119,.16),transparent 38%),linear-gradient(rgba(255,250,243,.16),rgba(255,250,243,.16)),url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-finale-v2.webp") center/cover no-repeat,#fffaf3; }
.skin-warm-letter .gift-finale::before { border-radius:4px; animation:none; }
.skin-warm-letter .gift-sound { width:62px; height:62px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
.skin-warm-letter .gift-sound svg { display:none!important; }
.skin-warm-letter .gift-sound-art { background-position:0 0; }
.skin-warm-letter .gift-sound.is-muted .gift-sound-art { display:block; background-position:33.333% 0; }
.skin-warm-letter .gift-sound::before,.skin-warm-letter .gift-sound::after { display:none; }
.skin-warm-letter .gift-sound.is-media-hidden { opacity:0; transform:translateY(14px) scale(.88); pointer-events:none; }
.skin-warm-letter .gift-main > section[data-website-block] { position:relative; }
@media (max-width: 790px) {
    .skin-warm-letter .gift-envelope { grid-template-columns:1fr; grid-template-rows:auto minmax(240px,34svh); gap:0; padding:20px 14px 0; }
    .skin-warm-letter .gift-hero,.skin-warm-letter .gift-hero.is-art-only { grid-template-columns:1fr; grid-template-rows:auto minmax(320px,46svh); min-height:auto; gap:18px; padding:72px 18px 48px; }
    .skin-warm-letter .gift-hero-copy,.skin-warm-letter .gift-hero.is-art-only .gift-hero-copy { grid-column:1; grid-row:1; padding:28px 20px; border-width:30px; }
    .skin-warm-letter .gift-hero-copy h2,.skin-warm-letter .gift-hero.is-art-only .gift-hero-copy h2 { font-size:clamp(2.8rem,13vw,4.4rem); }
    .skin-warm-letter .gift-hero-visual,.skin-warm-letter .gift-hero.is-art-only .gift-hero-visual { grid-column:1; grid-row:2; min-height:320px; }
    .skin-warm-letter .gift-hero-visual figure { inset:0 6% 5%; border-width:30px; }
    .skin-warm-letter .gift-story { grid-template-columns:1fr; padding:72px 18px 44px; }
    .skin-warm-letter .gift-story>div:first-of-type { padding:26px 18px; border-width:30px; }
    .skin-warm-letter .gift-sound { right:14px; bottom:14px; width:58px; height:58px; }
    .skin-warm-letter .gift-work { padding-top:150px; }
}
/* Один warm-letter обслуживает и подарки, и приглашения. Эти блоки описывают
   только факты события, сохраняя общую бумажную сценографию и арт-библиотеку. */
.site-invitation .gift-main { background:#f7f0e8; }
.site-invitation .gift-hero { min-height:var(--hero-min-height, min(78svh, 760px)); }
.site-invitation .gift-hero-copy h2 { text-wrap:balance; }
.gift-event-date:before,
.gift-event-section:before {
    position:absolute;
    inset:0;
    background:linear-gradient(125deg,rgba(255,250,243,.74),rgba(244,224,216,.58)),url("../../../images/content-websites/art/warm-letter-v2/warm-letter-background-story-v1.webp") center/cover;
    content:"";
}
.gift-event-calendar {
    display:grid;
    width:min(100%,560px);
    min-height:560px;
    place-content:center;
    justify-self:center;
    border:58px solid transparent;
    border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-text-master-v2.webp") 130 stretch;
    background:#fffaf3;
    color:var(--warm-ink);
    text-align:center;
    filter:drop-shadow(0 26px 46px rgba(69,43,35,.14));
}
.gift-event-note {
    position:relative;
    max-width:1050px;
    margin:clamp(74px,9vw,140px) auto;
    padding:clamp(42px,6vw,82px);
    border:48px solid transparent;
    border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-frame-text-master-v2.webp") 130 stretch;
    background:#fffaf3;
    text-align:center;
}
.gift-event-rsvp {
    position:relative;
    display:grid;
    min-height:min(900px,92svh);
    padding:clamp(126px,13vw,190px) 24px clamp(84px,9vw,130px);
    place-items:center;
    overflow:hidden;
    background:#f5e6df url("../../../images/content-websites/art/warm-letter-v2/warm-letter-rsvp-background-v1.webp") center/cover no-repeat;
}
.gift-event-rsvp .invitation-rsvp {
    position:relative;
    box-sizing:border-box;
    width:100%;
    min-height:470px;
    margin:0;
    padding:clamp(176px,15vw,208px) clamp(44px,5vw,72px) clamp(44px,5vw,72px);
    border:clamp(54px,6vw,74px) solid transparent;
    border-image:url("../../../images/content-websites/art/warm-letter-v2/warm-letter-rsvp-frame-master-v1.webp") 360 stretch;
    background:rgba(255,250,243,.56);
    text-align:center;
    backdrop-filter:blur(3px);
}
