/* ═══ VANCE OS — INVITES BOUTIQUE (PREMIUM V2) ═══ */
.serif{font-family:'Cormorant Garamond',Georgia,serif}
html{scroll-behavior:smooth}

/* gold shimmer for serif accents */
.shine{background:linear-gradient(100deg,#C9A44C 20%,#F4E3B2 40%,#E7C98B 50%,#C9A44C 62%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 5.5s ease-in-out infinite}
@keyframes shine{0%,100%{background-position:100% 0}50%{background-position:0 0}}

/* film grain */
.grain::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0.05;z-index:4;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E")}

/* ── HERO — cinematic crossfade of the three covers ── */
.iv-hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;overflow:hidden;padding:150px 24px 110px;background:var(--bg)}
.iv-bg{position:absolute;inset:-4%;background-size:cover;background-position:center 20%;opacity:0;transform:scale(1.06);animation:ivXfade 24s infinite;filter:brightness(0.32) saturate(1.15)}
.iv-bg.b1{background-image:url('img/invite1.jpg');animation-delay:0s}
.iv-bg.b2{background-image:url('img/invite3.jpg');animation-delay:8s}
.iv-bg.b3{background-image:url('img/invite2.jpg');animation-delay:16s}
@keyframes ivXfade{0%{opacity:0;transform:scale(1.06)}6%{opacity:1}33%{opacity:1}42%{opacity:0;transform:scale(1.12)}100%{opacity:0}}
.iv-hero-veil{position:absolute;inset:0;background:radial-gradient(1100px 640px at 50% 32%,rgba(10,10,14,0.1),rgba(10,10,14,0.88) 78%);z-index:1}
.iv-hero>*{position:relative;z-index:2}
.iv-hero-kicker{font-family:var(--font-mono);font-size:10px;letter-spacing:0.4em;text-transform:uppercase;color:#C8B594;margin-bottom:30px}
.iv-hero h1{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(48px,8.6vw,116px);line-height:1.03;color:var(--white);max-width:15ch;margin:0 auto;text-shadow:0 4px 40px rgba(0,0,0,0.5)}
.iv-hero h1 em{font-style:italic}
.iv-hero .wl{display:inline-block;opacity:0;transform:translateY(26px);transition:opacity 0.9s cubic-bezier(0.2,0.7,0.2,1),transform 0.9s cubic-bezier(0.2,0.7,0.2,1);transition-delay:calc(var(--i)*0.12s + 0.15s)}
.iv-hero .reveal.visible .wl,.iv-hero h1.visible .wl{opacity:1;transform:none}
.iv-orn{width:190px;height:26px;margin:30px auto 0;display:block;opacity:0.9}
.iv-hero-sub{margin-top:26px;color:#C9C9C4;font-size:18px;line-height:1.85;max-width:580px}
.iv-hero-sub strong{color:var(--white);font-weight:500}
.iv-hero-cta{margin-top:44px;display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.iv-particle{position:absolute;border-radius:50%;filter:blur(1.5px);animation:ivFloat linear infinite;pointer-events:none;z-index:2}
.iv-particle.gold{background:#E7C98B}.iv-particle.rose{background:#E7C7BE}
@keyframes ivFloat{0%{transform:translateY(28vh);opacity:0}12%{opacity:0.3}86%{opacity:0.18}100%{transform:translateY(-50vh) translateX(30px);opacity:0}}
.iv-scroll{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;color:#9a9a94;font-family:var(--font-mono);font-size:9px;letter-spacing:0.32em;text-transform:uppercase;z-index:2}
.iv-scroll::after{content:'';width:1px;height:46px;background:linear-gradient(#C8B594,transparent);animation:ivDrip 2.2s ease-in-out infinite}
@keyframes ivDrip{0%{transform:scaleY(0);transform-origin:top}55%{transform:scaleY(1);transform-origin:top}56%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ── MOMENTS MARQUEE ── */
.iv-marq{border-top:1px solid rgba(201,164,76,0.18);border-bottom:1px solid rgba(201,164,76,0.18);background:#0D0C10;overflow:hidden;padding:24px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.iv-marq-track{display:flex;gap:56px;width:max-content;padding-right:56px;animation:marq 34s linear infinite;align-items:baseline}
.iv-marq span{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:26px;color:#C8B594;white-space:nowrap}
.iv-marq i{font-style:normal;color:#5a5348;font-size:14px}

/* ── PAPER VS THIS ── */
.iv-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:0;margin-top:56px;max-width:940px;align-items:stretch}
.iv-vs-col{background:var(--bg-3);border:1px solid var(--border);padding:46px 42px}
.iv-vs-col.paper{opacity:0.82;filter:saturate(0.6)}
.iv-vs-col.this{position:relative;border-color:rgba(201,164,76,0.35);box-shadow:0 0 60px rgba(201,164,76,0.06)}
.iv-vs-col.this::before,.iv-vs-col.this::after{content:'';position:absolute;width:22px;height:22px;border:1px solid #C9A44C}
.iv-vs-col.this::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.iv-vs-col.this::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.iv-vs-amp{display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:44px;color:#C9A44C;padding:0 26px}
.iv-vs-h{font-family:'Cormorant Garamond',Georgia,serif;font-size:36px;font-weight:500;margin-bottom:24px;color:var(--grey)}
.iv-vs-col.this .iv-vs-h{color:#E7C98B;font-style:italic}
.iv-vs-col p{color:var(--grey);font-size:15.5px;line-height:1.75;margin-bottom:13px;padding-left:18px;border-left:1px solid var(--border)}
.iv-vs-col.this p{color:#DCDCD6;border-left-color:rgba(201,164,76,0.5)}

/* ── SHOWCASES ── */
.iv-show{padding:140px 0;position:relative;overflow:hidden}
.iv-show.blush{background:radial-gradient(1050px 640px at 82% 16%,rgba(231,199,190,0.10),transparent 62%),var(--bg-2)}
.iv-show.midnight{background:radial-gradient(1050px 640px at 18% 20%,rgba(84,110,168,0.16),transparent 62%),#070C1A}
.iv-show.wine{background:radial-gradient(1050px 640px at 82% 20%,rgba(150,52,80,0.17),transparent 62%),#1C060E}
.iv-num{position:absolute;top:40px;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:500;font-size:clamp(180px,26vw,340px);line-height:1;opacity:0.06;pointer-events:none;user-select:none}
.blush .iv-num{color:#E7C7BE;right:4%}.midnight .iv-num{color:#9FB4DE;left:4%}.wine .iv-num{color:#E0A5B4;right:4%}
.iv-show-grid{display:grid;grid-template-columns:minmax(0,430px) 1fr;gap:96px;align-items:center;position:relative}
.iv-show.flip .iv-show-grid{grid-template-columns:1fr minmax(0,430px)}
.iv-show.flip .iv-phone-wrap{order:2}
.iv-style-tag{font-family:var(--font-mono);font-size:10px;letter-spacing:0.32em;text-transform:uppercase;margin-bottom:20px;display:flex;align-items:center;gap:14px}
.iv-style-tag::after{content:'';height:1px;width:54px;background:currentColor;opacity:0.5}
.blush .iv-style-tag{color:#E7C7BE}.midnight .iv-style-tag{color:#9FB4DE}.wine .iv-style-tag{color:#E0A5B4}
.iv-show h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(42px,5.2vw,68px);line-height:1.04;color:var(--white);margin-bottom:16px}
.iv-show h2 em{font-style:italic}
.blush .iv-show h2 em{color:#E7C7BE}.midnight .iv-show h2 em{color:#C9D4EA}.wine .iv-show h2 em{color:#E0A5B4}
.iv-person{color:#B9B9B3;font-size:17px;line-height:1.85;margin-bottom:30px;max-width:46ch}
.iv-person strong{color:var(--white);font-weight:500}
.iv-featlist{margin-bottom:40px}
.iv-featlist li{list-style:none;color:#ABABA5;font-size:15.5px;line-height:1.7;padding:11px 0 11px 30px;position:relative;border-bottom:1px solid rgba(255,255,255,0.06);opacity:0;transform:translateX(-14px);transition:opacity 0.7s,transform 0.7s;transition-delay:calc(var(--i)*0.12s)}
.reveal.visible .iv-featlist li,.iv-featlist.visible li{opacity:1;transform:none}
.iv-featlist li::before{content:'❧';position:absolute;left:0;top:10px;font-size:15px}
.blush .iv-featlist li::before{color:#E7C7BE}.midnight .iv-featlist li::before{color:#9FB4DE}.wine .iv-featlist li::before{color:#E0A5B4}
.iv-open-btn{display:inline-block;position:relative;overflow:hidden;padding:17px 38px;font-family:var(--font-body);font-weight:600;font-size:14px;letter-spacing:0.11em;text-transform:uppercase;text-decoration:none;border:1px solid;transition:color 0.35s,box-shadow 0.35s}
.iv-open-btn::before{content:'';position:absolute;inset:0;transform:translateX(-101%);transition:transform 0.35s cubic-bezier(0.3,0.7,0.2,1);z-index:-1}
.iv-open-btn:hover::before{transform:none}
.blush .iv-open-btn,.gold-btn{border-color:#E7C7BE;color:#E7C7BE}
.blush .iv-open-btn::before{background:#E7C7BE}
.blush .iv-open-btn:hover{color:#3A211B;box-shadow:0 0 44px rgba(231,199,190,0.28)}
.midnight .iv-open-btn{border-color:#9FB4DE;color:#C9D4EA}
.midnight .iv-open-btn::before{background:#C9D4EA}
.midnight .iv-open-btn:hover{color:#0A1226;box-shadow:0 0 44px rgba(159,180,222,0.28)}
.wine .iv-open-btn{border-color:#E0A5B4;color:#E0A5B4}
.wine .iv-open-btn::before{background:#E0A5B4}
.wine .iv-open-btn:hover{color:#3A0E1B;box-shadow:0 0 44px rgba(224,165,180,0.28)}
.gold-btn::before{background:#E7C7BE}
.gold-btn:hover{color:#3A211B !important;box-shadow:0 0 44px rgba(231,199,190,0.28)}

/* PHONE */
.iv-phone-wrap{display:flex;justify-content:center;position:relative}
.iv-halo{position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(70px);opacity:0.35;z-index:0}
.blush .iv-halo{background:#E7C7BE33}.midnight .iv-halo{background:#5D7BC633}.wine .iv-halo{background:#96345033}
.iv-phone{width:min(276px,74vw);aspect-ratio:9/19.2;border-radius:42px;border:9px solid #16161E;background:#0B0B12;box-shadow:0 60px 120px rgba(0,0,0,0.65),0 0 0 1px rgba(255,255,255,0.07);position:relative;overflow:hidden;z-index:1;animation:phoneFloat 7s ease-in-out infinite;transition:box-shadow 0.4s;will-change:transform}
@keyframes phoneFloat{0%,100%{transform:translateY(0) rotate(-0.4deg)}50%{transform:translateY(-12px) rotate(0.4deg)}}
.iv-phone:hover{box-shadow:0 70px 140px rgba(0,0,0,0.7),0 0 60px rgba(255,255,255,0.05)}
.iv-phone::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:42%;height:22px;background:#16161E;border-radius:0 0 14px 14px;z-index:5}
.iv-phone::after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,0.13) 50%,transparent 58%);transform:translateX(-130%);transition:transform 0.9s ease;z-index:4;pointer-events:none}
.iv-phone:hover::after{transform:translateX(130%)}
.iv-screen{position:absolute;inset:0}
.iv-screen img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;position:relative;z-index:2}
.iv-fallback{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:12px;padding:20px;z-index:1}
.iv-fallback .fk{font-family:var(--font-mono);font-size:8px;letter-spacing:0.28em;text-transform:uppercase}
.iv-fallback .fn{font-family:'Cormorant Garamond',Georgia,serif;font-size:30px;font-weight:500;line-height:1.15}
.iv-fallback.f1{background:linear-gradient(170deg,#F6E7E2,#E7C7BE)}.iv-fallback.f1 .fk{color:#A96E60}.iv-fallback.f1 .fn{color:#46281F}
.iv-fallback.f2{background:linear-gradient(170deg,#0A1226,#060B18)}.iv-fallback.f2 .fk{color:#8FA3C8}.iv-fallback.f2 .fn{color:#F4F1E9}
.iv-fallback.f3{background:linear-gradient(170deg,#3A0E1B,#2A0713)}.iv-fallback.f3 .fk{color:#D6A5B0}.iv-fallback.f3 .fn{color:#F6E7EA}

/* ── INCLUDES ── */
.iv-inc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:56px}
.iv-inc{background:var(--bg-3);border:1px solid var(--border);padding:36px 30px;position:relative;transition:transform 0.35s,border-color 0.35s;opacity:0;transform:translateY(18px);transition:opacity 0.7s,transform 0.7s,border-color 0.35s;transition-delay:calc(var(--i)*0.08s)}
.reveal.visible .iv-inc{opacity:1;transform:none}
.iv-inc::before{content:'';position:absolute;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#C9A44C,transparent);transform:scaleX(0);transition:transform 0.4s}
.iv-inc:hover{border-color:rgba(201,164,76,0.35);transform:translateY(-4px) !important}
.iv-inc:hover::before{transform:none}
.iv-inc-ic{width:46px;height:46px;border:1px solid rgba(201,164,76,0.4);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:18px}
.iv-inc-t{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;font-weight:600;color:var(--white);margin-bottom:8px}
.iv-inc p{color:var(--grey);font-size:13.5px;line-height:1.65}

/* ── STEPS ── */
.iv-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:64px;margin-top:70px;max-width:1040px;position:relative}
.iv-steps::before{content:'';position:absolute;top:26px;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,rgba(201,164,76,0.35),transparent)}
.iv-step{position:relative}
.iv-step-n{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:56px;line-height:1;margin-bottom:18px;background:#0F0F16;display:inline-block;padding:0 16px;position:relative}
.iv-step-t{font-family:var(--font-display);font-size:21px;font-weight:800;text-transform:uppercase;letter-spacing:0.05em;color:var(--white);margin-bottom:10px}
.iv-steps p{color:var(--grey);font-size:15px;line-height:1.75}

/* ── PLANNER BAND ── */
.iv-planner{position:relative;overflow:hidden;background:#0B0A10}
.iv-planner-bg{position:absolute;inset:-4%;background:url('img/invite2.jpg') center 30%/cover;filter:brightness(0.22) saturate(1.2);transform:scale(1.05)}
.iv-planner-veil{position:absolute;inset:0;background:radial-gradient(900px 500px at 50% 50%,rgba(11,10,16,0.25),rgba(11,10,16,0.92))}
.iv-planner .section-inner{position:relative;text-align:center;max-width:780px;z-index:2}
.iv-planner h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(36px,4.8vw,58px);color:var(--white)}
.iv-planner h2 em{font-style:italic}
.iv-planner p{color:#C5C5BF;font-size:16.5px;line-height:1.85;margin:24px auto 38px;max-width:58ch}
.iv-planner p strong{color:var(--white);font-weight:500}

/* ── FINAL ── */
.iv-final{text-align:center;position:relative;overflow:hidden}
.iv-amp{position:absolute;top:50%;left:50%;transform:translate(-50%,-54%);font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:clamp(340px,44vw,620px);color:rgba(231,199,190,0.05);line-height:1;pointer-events:none;user-select:none}
.iv-final .section-inner{position:relative}
.iv-final h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(46px,7.4vw,92px);line-height:1.06;color:var(--white)}
.iv-final h2 em{font-style:italic}
.iv-final-sub{color:var(--grey);font-size:17px;margin:26px auto 42px;max-width:52ch;line-height:1.85}
.iv-cta-main{display:inline-block;position:relative;overflow:hidden;padding:21px 56px;background:linear-gradient(100deg,#E7C7BE,#D9B3A8);color:#3A211B;font-family:var(--font-body);font-weight:700;font-size:15px;letter-spacing:0.11em;text-transform:uppercase;text-decoration:none;transition:box-shadow 0.35s,transform 0.35s}
.iv-cta-main::after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,0.5) 50%,transparent 60%);transform:translateX(-130%);transition:transform 0.7s}
.iv-cta-main:hover{box-shadow:0 0 70px rgba(231,199,190,0.4);transform:translateY(-2px)}
.iv-cta-main:hover::after{transform:translateX(130%)}

/* ── RESPONSIVE / MOTION ── */
@media(max-width:900px){
  .iv-show{padding:96px 0}
  .iv-show-grid,.iv-show.flip .iv-show-grid{grid-template-columns:1fr;gap:60px}
  .iv-show.flip .iv-phone-wrap{order:0}
  .iv-inc-grid{grid-template-columns:repeat(2,1fr)}
  .iv-steps{grid-template-columns:1fr;gap:46px}
  .iv-steps::before{display:none}
  .iv-vs{grid-template-columns:1fr}
  .iv-vs-amp{padding:18px 0}
  .iv-num{font-size:160px;top:16px}
}
@media(max-width:560px){
  .iv-inc-grid{grid-template-columns:1fr}
  .iv-hero-cta a,.iv-open-btn,.iv-cta-main{display:block;width:100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .iv-particle,.iv-scroll::after,.iv-bg,.iv-marq-track,.iv-phone{animation:none}
  .iv-bg.b1{opacity:1}
  .shine{animation:none;background-position:50% 0}
  .iv-phone::after,.iv-cta-main::after{display:none}
}