/* =========================================================
   ZIARAMA WEDDING — EXPERIENCE V4
   Cinematic couple pages, real carousel imagery, immersive
   portraits and a full-screen storybook reader.
   ========================================================= */

:root{
  --v4-ink:#2b1912;
  --v4-brown:#4a2818;
  --v4-gold:#b9844f;
  --v4-gold-soft:#d8b98e;
  --v4-ivory:#fffaf4;
  --v4-paper:#fbf5ec;
  --v4-line:rgba(87,53,33,.14);
  --v4-shadow:0 30px 90px rgba(45,27,17,.12);
}

/* Header: cleaner, lighter, no CTA pill clutter. */
.site-header{transition:transform .42s cubic-bezier(.2,.8,.2,1),opacity .28s ease,background .3s ease!important}
.site-header.is-scroll-hidden{transform:translateY(-120%)!important;opacity:0!important;pointer-events:none!important}
.site-header .nav-wrap{border-left:0!important;border-right:0!important;box-shadow:0 14px 46px rgba(43,25,18,.055)!important}
.love-experience-v4 .site-header:not(.is-scrolled):not(.scrolled) .nav-wrap,
.home-page .site-header:not(.is-scrolled):not(.scrolled) .nav-wrap{background:linear-gradient(180deg,rgba(18,10,6,.36),rgba(18,10,6,.04))!important;box-shadow:none!important;border-color:transparent!important}
.love-experience-v4 .site-header:not(.is-scrolled):not(.scrolled) .desktop-nav a,
.love-experience-v4 .site-header:not(.is-scrolled):not(.scrolled) .text-link,
.love-experience-v4 .site-header:not(.is-scrolled):not(.scrolled) .brand b,
.home-page .site-header:not(.is-scrolled):not(.scrolled) .desktop-nav a,
.home-page .site-header:not(.is-scrolled):not(.scrolled) .text-link,
.home-page .site-header:not(.is-scrolled):not(.scrolled) .brand b{color:#fff!important}
.love-experience-v4 .site-header:not(.is-scrolled):not(.scrolled) .brand small,
.home-page .site-header:not(.is-scrolled):not(.scrolled) .brand small{color:#e8cda8!important}

/* ----------------------------- HOME CAROUSEL ----------------------------- */
.home-hero-v4{height:100svh!important;min-height:680px!important;position:relative;overflow:hidden;background:#1b100b!important}
.home-carousel-media{position:absolute;inset:0;overflow:hidden}
.home-carousel-slide{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.055);transition:opacity 1.15s ease,transform 7s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.home-carousel-slide.is-active{opacity:1;transform:scale(1);pointer-events:auto}
.home-carousel-slide img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.home-hero-v4 .home-hero-shade{z-index:2;background:linear-gradient(90deg,rgba(23,13,8,.70),rgba(23,13,8,.2) 60%,rgba(23,13,8,.18)),linear-gradient(0deg,rgba(20,10,6,.60),transparent 54%,rgba(20,10,6,.16))!important}
.home-hero-v4 .home-hero-content{z-index:3;position:relative}
.home-carousel-meta{position:absolute;z-index:4;right:5vw;bottom:54px;color:#fff;min-width:220px;text-align:right;font:500 17px var(--zi-serif)}
.home-carousel-meta span{display:none}.home-carousel-meta span.is-active{display:block}.home-carousel-meta i{color:#e4ba82;font-weight:400}
.home-carousel-dots{position:absolute;z-index:4;left:5vw;bottom:50px;display:flex;gap:8px}
.home-carousel-dots button{width:26px;height:2px;border:0;border-radius:99px;background:rgba(255,255,255,.35);padding:0;cursor:pointer;transition:.3s}
.home-carousel-dots button.is-active{width:58px;background:#fff}

/* ------------------------- COUPLE CINEMATIC HERO ------------------------- */
.love-experience-v4{background:var(--v4-ivory);overflow-x:hidden}
.love-experience-v4 main{overflow:hidden}
.couple-cinema-hero{height:100svh;min-height:720px;position:relative;background:#17100c;overflow:hidden}
.couple-cinema-slides,.couple-cinema-slide{position:absolute;inset:0}
.couple-cinema-slide{margin:0;opacity:0;transform:scale(1.055);transition:opacity 1.1s ease,transform 6.6s cubic-bezier(.18,.8,.18,1)}
.couple-cinema-slide.is-active{opacity:1;transform:scale(1)}
.couple-cinema-slide img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.couple-cinema-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,8,5,.12),rgba(15,8,5,.05) 35%,rgba(15,8,5,.68)),linear-gradient(90deg,rgba(15,8,5,.13),transparent 55%);z-index:2}
.couple-cinema-copy{position:absolute;z-index:3;left:50%;bottom:8vh;transform:translateX(-50%);width:min(1000px,90vw);text-align:center;color:#fff}
.couple-cinema-copy h1{margin:0;font:400 clamp(68px,9vw,142px)/.84 var(--zi-serif);letter-spacing:-.055em;text-shadow:0 8px 35px rgba(0,0,0,.2)}
.couple-cinema-copy h1 i{font-weight:400;color:#e1b67a}
.couple-cinema-copy p{margin:23px 0 30px;font:500 11px var(--zi-sans);letter-spacing:.54em}
.couple-discover{display:inline-flex;flex-direction:column;gap:13px;align-items:center;color:#fff;font:600 8px var(--zi-sans);letter-spacing:.28em;text-decoration:none}
.couple-discover span{width:49px;height:49px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.75);border-radius:50%;font-size:18px;transition:.25s}
.couple-discover:hover span{transform:translateY(4px);background:rgba(255,255,255,.09)}
.couple-cinema-dots{position:absolute;z-index:4;right:34px;bottom:34px;display:flex;gap:7px}
.couple-cinema-dots button{border:0;padding:0;width:18px;height:2px;background:rgba(255,255,255,.38);border-radius:99px;transition:.3s;cursor:pointer}
.couple-cinema-dots button.is-active{width:42px;background:#fff}

/* ------------------------- PARTNER PORTRAIT CHAPTERS ------------------------- */
.portrait-chapter{background:var(--v4-ivory);position:relative}
.portrait-media{width:100%;height:min(84svh,980px);min-height:620px;overflow:hidden;background:#ddcfc1}
.portrait-media img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 28%;transform:scale(1.015);transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.portrait-media.is-visible img{transform:scale(1)}
.portrait-copy{width:min(980px,86vw);margin:auto;text-align:center;padding:72px 0 110px;position:relative}
.portrait-copy:before{content:"";position:absolute;left:-180px;bottom:0;width:330px;height:420px;background:var(--flair-b1) left bottom/contain no-repeat;opacity:.15;pointer-events:none}
.portrait-chapter-her .portrait-copy:before{left:auto;right:-180px;background-image:var(--flair-b2);background-position:right bottom}
.portrait-copy small{font:600 9px var(--zi-sans);letter-spacing:.35em;color:#9b6a4b}
.portrait-copy h2{margin:9px 0 0;font:400 clamp(64px,7vw,110px)/.9 var(--zi-serif);letter-spacing:-.055em}
.portrait-rule{width:44px;height:1px;background:#bd8853;margin:23px auto 27px}
.portrait-copy blockquote{margin:0 auto;max-width:700px;font:italic 400 clamp(24px,2.4vw,36px)/1.42 var(--zi-serif);color:#5f4638}
.reveal-v4{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.8,.2,1)}.reveal-v4.is-visible{opacity:1;transform:none}

/* ------------------------------ LOVE SCROLL BEAT ------------------------------ */
.love-sequence-v4{min-height:88svh;display:grid;place-items:center;background:linear-gradient(180deg,#f8efe5,#fffaf3 48%,#f5eadf);position:relative;overflow:hidden}
.love-sequence-v4:before,.love-sequence-v4:after{content:"";position:absolute;top:7%;bottom:7%;width:320px;opacity:.16;background-repeat:no-repeat;background-size:contain;pointer-events:none}
.love-sequence-v4:before{left:-120px;background-image:var(--flair-b3);background-position:left center}.love-sequence-v4:after{right:-120px;background-image:var(--flair-b4);background-position:right center}
.love-sequence-inner{display:grid;grid-template-columns:auto auto;gap:75px;align-items:center;position:relative;z-index:1}
.love-letters{display:flex;flex-direction:column;gap:2px}
.love-letters span{font:400 clamp(70px,8vw,122px)/.78 var(--zi-serif);color:rgba(99,54,31,.12);transform:translateX(-28px);transition:.7s cubic-bezier(.2,.8,.2,1)}
.love-letters span.is-active{color:#a36b3f;transform:none;text-shadow:0 12px 38px rgba(105,64,37,.10)}
.love-sequence-copy{display:flex;flex-direction:column;gap:4px;font-family:var(--zi-serif);min-width:240px}
.love-sequence-copy b{font-size:34px;font-weight:400}.love-sequence-copy span{font-size:29px}.love-sequence-copy em{font-size:24px;color:#9d6a48}

/* ---------------------------- IMMERSIVE STORYBOOK ---------------------------- */
.story-immersive-v4{min-height:100svh;background:radial-gradient(circle at 50% 0,#fff 0,#fbf4eb 56%,#f2e6d8 100%);padding:100px 0 120px;position:relative;overflow:hidden}
.story-immersive-v4:before,.story-immersive-v4:after{content:"";position:absolute;top:0;width:280px;height:420px;background-repeat:no-repeat;background-size:contain;opacity:.20;pointer-events:none}.story-immersive-v4:before{left:-90px;background-image:var(--flair-b1)}.story-immersive-v4:after{right:-100px;background-image:var(--flair-b2);background-position:right top}
.story-intro-v4{text-align:center;width:min(850px,88vw);margin:0 auto 46px;position:relative;z-index:1}.story-intro-v4 small{font:600 8px var(--zi-sans);letter-spacing:.36em;color:#956444}.story-intro-v4 h2{margin:10px 0 12px;font:400 clamp(54px,6vw,92px)/.9 var(--zi-serif);letter-spacing:-.05em}.story-intro-v4 h2 em{font-weight:400;color:#b37a4c}.story-intro-v4 p{margin:0 auto;max-width:620px;font:400 18px/1.55 var(--zi-serif);color:#786155}
.storybook-shell-v4{width:min(1320px,96vw);margin:auto;position:relative;z-index:2}
.storybook-v4{height:min(72svh,760px)!important;max-width:none!important;margin:0!important;perspective:3400px!important;touch-action:pan-y!important}
.storybook-v4 .book-pages{inset:0 56px!important}
.storybook-v4 .book-front{display:grid!important;grid-template-columns:1fr 1.08fr!important}
.storybook-v4 .book-copy{order:1!important;padding:58px 54px 50px!important;background:linear-gradient(90deg,#fffaf3,#fffdf9)!important}
.storybook-v4 .book-photo{order:2!important;padding:34px 34px 34px 24px!important}
.storybook-v4 .book-photo img{width:100%;height:100%;object-fit:cover;border-radius:10px!important}
.storybook-v4 .book-copy h3{font-size:clamp(39px,4vw,58px)!important;line-height:.92!important}.storybook-v4 .book-story-render{font-size:18px!important;line-height:1.68!important}.storybook-v4 .book-copy time{font-size:18px!important}.storybook-v4 .book-copy em{display:block;margin-top:4px!important}
.storybook-v4 .book-face{border:1px solid rgba(111,73,46,.10);box-shadow:0 38px 110px rgba(68,40,24,.17),inset 0 0 80px rgba(191,146,105,.035)!important}
.storybook-v4 .book-spine{display:block!important;z-index:55!important}
.storybook-v4 .book-nav{display:grid!important;place-items:center!important}
.story-page-count{text-align:center;margin-top:42px;font:500 10px var(--zi-sans);letter-spacing:.20em;color:#8f725f}.story-page-count i{font-style:normal;margin:0 8px;color:#c49b6d}
.book-reader-active .site-header{transform:translateY(-120%);opacity:0;pointer-events:none}

/* --------------------------------- EVENTS --------------------------------- */
.events-v4{padding:120px 0;background:#fffaf4;position:relative}.events-v4:after{content:"";position:absolute;right:-120px;top:80px;width:360px;height:580px;background:var(--flair-b5) right top/contain no-repeat;opacity:.12;pointer-events:none}
.section-title-v4 small{font:600 8px var(--zi-sans);letter-spacing:.35em;color:#9e6b4a}.section-title-v4 h2{font:400 clamp(54px,6vw,88px)/.9 var(--zi-serif);letter-spacing:-.05em;margin:10px 0 55px}.section-title-v4 h2 em{font-weight:400;color:#b17a4c}.section-title-center{text-align:center}.events-timeline-v4{display:grid;gap:38px}.event-v4{display:grid;grid-template-columns:90px minmax(300px,.9fr) minmax(320px,1fr);gap:34px;align-items:center;padding-bottom:38px;border-bottom:1px solid var(--v4-line)}
.event-number{font:400 44px var(--zi-serif);color:#b27c4b}.event-visual{height:330px;overflow:hidden;border-radius:26px;background:#eadfd4}.event-visual img{width:100%;height:100%;object-fit:cover;transition:.65s}.event-v4:hover .event-visual img{transform:scale(1.025)}
.event-copy-v4 small{font:600 8px var(--zi-sans);letter-spacing:.2em;color:#a16f4d;text-transform:uppercase}.event-copy-v4 h3{font:400 42px/1 var(--zi-serif);margin:9px 0 8px}.event-copy-v4 b{font:500 16px var(--zi-serif);color:#8b5f46}.event-copy-v4 p{font:400 17px/1.65 var(--zi-serif);color:#756055;max-width:540px}.event-copy-v4 span{font:500 11px var(--zi-sans);color:#8f634a}

/* -------------------------------- SILHOUETTES -------------------------------- */
.silhouettes-v4{padding:120px 0 130px;background:linear-gradient(180deg,#f8efe6,#fffaf4);position:relative;overflow:hidden}.silhouettes-v4:before{content:"";position:absolute;left:-120px;bottom:0;width:390px;height:620px;background:var(--flair-b6) left bottom/contain no-repeat;opacity:.12;pointer-events:none}
.silhouette-grid-v4{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:150px;gap:12px}.silhouette-tile{margin:0;position:relative;overflow:hidden;border-radius:20px;background:#dfd1c4}.silhouette-tile img{width:100%;height:100%;object-fit:cover;transition:.65s}.silhouette-tile:hover img{transform:scale(1.035)}.silhouette-tile figcaption{position:absolute;left:15px;bottom:12px;color:#fff;font:500 12px var(--zi-serif);text-shadow:0 3px 18px rgba(0,0,0,.55)}
.st-1{grid-column:span 7;grid-row:span 3}.st-2{grid-column:span 5;grid-row:span 2}.st-3{grid-column:span 5;grid-row:span 1}.st-4,.st-5,.st-6{grid-column:span 4;grid-row:span 2}.st-7{grid-column:span 5;grid-row:span 2}.st-8{grid-column:span 7;grid-row:span 2}
.silhouette-more{display:flex;width:max-content;margin:38px auto 0;gap:14px;align-items:center;text-decoration:none;color:var(--v4-brown);font:600 10px var(--zi-sans);letter-spacing:.14em;text-transform:uppercase}.silhouette-more span{width:42px;height:42px;border:1px solid #d8b997;border-radius:50%;display:grid;place-items:center;font-size:16px}

/* ---------------------------------- ENDING ---------------------------------- */
.couple-ending-v4{height:82svh;min-height:620px;position:relative;overflow:hidden;background:#23150e}.couple-ending-v4>img{width:100%;height:100%;object-fit:cover}.couple-ending-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,11,6,.66),rgba(20,11,6,.10) 65%),linear-gradient(0deg,rgba(20,11,6,.35),transparent)}.couple-ending-copy{position:absolute;left:7vw;bottom:10vh;color:#fff}.couple-ending-copy small{font:600 8px var(--zi-sans);letter-spacing:.36em}.couple-ending-copy h2{font:italic 400 clamp(64px,8vw,125px)/.9 var(--zi-serif);margin:10px 0 4px}.couple-ending-copy p{font:500 13px var(--zi-sans);letter-spacing:.22em;text-transform:uppercase}

/* -------------------------- GET STARTED CLEANUP -------------------------- */
.getstarted-user-preview[hidden]{display:none!important}
.get-started-v3 .step-indicator ul{display:flex!important;list-style:none!important;padding:0!important;margin:0!important;width:100%!important;align-items:flex-start!important}
.get-started-v3 .step-indicator .step{flex:1!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-direction:column!important;position:relative!important;text-align:center!important;line-height:1.25!important}
.get-started-v3 .step-indicator .step:before{display:grid!important;place-items:center!important;margin:0 auto 7px!important;position:relative!important;z-index:2!important}
.get-started-v3 .step-indicator:before,.get-started-v3 .step-progress{left:0!important;right:0!important;width:100%!important}

/* ------------------------------- RESPONSIVE ------------------------------- */
@media(max-width:980px){
  .home-carousel-meta{right:26px}.home-carousel-dots{left:26px}
  .portrait-media{height:76svh;min-height:520px}.portrait-copy{padding:58px 0 86px}
  .love-sequence-inner{gap:44px}.events-v4{padding:95px 0}.event-v4{grid-template-columns:62px 1fr;gap:22px}.event-copy-v4{grid-column:2}.event-visual{height:320px}
  .storybook-shell-v4{width:100vw}.storybook-v4 .book-pages{inset:0 22px!important}.storybook-v4 .book-copy{padding:42px 36px!important}.storybook-v4 .book-photo{padding:26px 26px 26px 18px!important}
}

@media(max-width:760px){
  /* mobile header becomes a clean logo + drawer trigger */
  .site-header{padding-top:7px!important}.site-header .nav-wrap{width:calc(100% - 20px)!important;height:58px!important;border-radius:17px!important;padding-inline:15px!important}.site-header .brand b{font-size:27px!important}.site-header .brand small{font-size:5px!important}.mobile-menu{top:70px!important}
  .home-carousel-meta{display:none}.home-carousel-dots{left:20px;bottom:27px}.home-carousel-slide img{object-position:center 35%}.home-hero-v4 .home-hero-content{padding-top:155px!important}.home-hero-v4 .home-hero-content h1{font-size:55px!important;line-height:.88!important}

  .couple-cinema-hero{min-height:100svh;height:100svh}.couple-cinema-slide img{object-position:center 35%}.couple-cinema-copy{bottom:7vh;width:92vw}.couple-cinema-copy h1{font-size:58px;line-height:.88}.couple-cinema-copy p{font-size:8px;letter-spacing:.38em;margin:16px 0 23px}.couple-cinema-dots{right:18px;bottom:18px}

  /* Portrait = photo first, then name and words underneath. */
  .portrait-media{height:72svh;min-height:520px}.portrait-media img{object-position:center 26%}.portrait-copy{width:88vw;padding:48px 0 72px}.portrait-copy:before{width:230px;height:300px;left:-145px;opacity:.11}.portrait-chapter-her .portrait-copy:before{right:-145px}.portrait-copy h2{font-size:68px}.portrait-copy blockquote{font-size:25px;line-height:1.38}

  /* LOVE owns one viewport on mobile and reveals while scrolling. */
  .love-sequence-v4{min-height:100svh}.love-sequence-inner{grid-template-columns:1fr;gap:38px;text-align:center}.love-letters{flex-direction:column;align-items:center}.love-letters span{font-size:78px;line-height:.72}.love-sequence-copy{min-width:0}.love-sequence-copy b{font-size:27px}.love-sequence-copy span{font-size:24px}.love-sequence-copy em{font-size:21px}

  /* Reader mode: book uses the complete phone width and keeps a true open spread. */
  .story-immersive-v4{padding:74px 0 52px;min-height:100svh}.story-intro-v4{width:90vw;margin-bottom:28px}.story-intro-v4 h2{font-size:54px}.story-intro-v4 p{font-size:16px}.storybook-shell-v4{width:100vw;margin:0}.storybook-v4{width:100vw!important;height:70svh!important;min-height:560px!important;margin:0!important;perspective:2200px!important}.storybook-v4 .book-pages{inset:0!important;padding:0 4px!important}.storybook-v4 .book-front{grid-template-columns:1fr 1.03fr!important}.storybook-v4 .book-copy{padding:25px 17px 21px!important;min-width:0!important}.storybook-v4 .book-photo{height:auto!important;padding:12px 12px 12px 6px!important;min-width:0!important}.storybook-v4 .book-photo img{height:100%!important}.storybook-v4 .book-copy small{font-size:6px!important;letter-spacing:.18em!important}.storybook-v4 .book-copy h3{font-size:29px!important;line-height:.93!important;margin:9px 0 7px!important}.storybook-v4 .book-copy time{font-size:13px!important}.storybook-v4 .book-copy em{font-size:11px!important}.storybook-v4 .book-story-render{font-size:12.5px!important;line-height:1.52!important;margin-top:10px!important}.storybook-v4 .book-photo span{font-size:9px!important}.storybook-v4 .book-spine{display:block!important;width:2px!important}.storybook-v4 .book-nav{display:none!important}.book-flip-leaf{height:100%!important}.book-flip-face>.book-copy{padding:25px 17px!important}.book-flip-face>.book-photo{padding:12px!important}.book-progress{bottom:-15px!important;width:100px!important}.story-page-count{margin-top:24px}.book-reader-active .v3-footer{visibility:hidden}

  .events-v4{padding:82px 0}.section-title-v4 h2{font-size:54px;margin-bottom:35px}.event-v4{grid-template-columns:46px 1fr;gap:14px;padding-bottom:28px}.event-number{font-size:29px}.event-visual{height:250px;border-radius:18px}.event-copy-v4 h3{font-size:32px}.event-copy-v4 p{font-size:15px}.events-v4:after{opacity:.07}

  .silhouettes-v4{padding:82px 0}.silhouette-grid-v4{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:180px;gap:8px}.silhouette-tile{grid-column:auto!important;grid-row:auto!important;border-radius:14px}.silhouette-tile:first-child{grid-column:1/-1!important;grid-row:span 2!important}.silhouette-tile:nth-child(4n){grid-column:1/-1!important}.couple-ending-v4{height:70svh;min-height:520px}.couple-ending-copy{left:24px;right:24px;bottom:58px}.couple-ending-copy h2{font-size:67px}

  /* On phones the form owns the experience; no split-screen photo wall. */
  .get-started-v3 .getstarted-visual{display:none!important}.get-started-v3 .getstarted-shell{padding-top:72px!important;display:block!important}.get-started-v3 .getstarted-formside{padding:54px 20px 74px!important}.get-started-v3 .step-indicator{overflow:hidden!important}.get-started-v3 .step-indicator ul{min-width:0!important}.get-started-v3 .step-indicator .step{font-size:0!important}.get-started-v3 .step-indicator .step:before{font-size:8px!important}.get-started-v3 .step-section>h2{font-size:45px!important}
}

@media(max-width:420px){
  .couple-cinema-copy h1{font-size:50px}.portrait-media{height:68svh;min-height:470px}.portrait-copy h2{font-size:61px}.portrait-copy blockquote{font-size:22px}.love-letters span{font-size:70px}
  .storybook-v4{height:68svh!important;min-height:525px!important}.storybook-v4 .book-copy{padding:21px 13px 18px!important}.storybook-v4 .book-copy h3{font-size:25px!important}.storybook-v4 .book-story-render{font-size:11.5px!important}.storybook-v4 .book-photo{padding:10px 9px 10px 4px!important}
}

@media(prefers-reduced-motion:reduce){.home-carousel-slide,.couple-cinema-slide,.reveal-v4,.love-letters span,.portrait-media img{transition:none!important}.reveal-v4{opacity:1!important;transform:none!important}}

/* Overlay header color is driven by the body theme in base.html. */
body[data-header-theme="overlay"] .site-header:not(.is-scrolled):not(.scrolled){color:#fff!important;background:transparent!important}
body[data-header-theme="overlay"] .site-header:not(.is-scrolled):not(.scrolled) .menu-btn span{background:#fff!important}
@media(max-width:900px){.home-hero-v4{margin-top:0!important;height:100svh!important}}

/* V4.1 header refinement */
.site-header{padding-top:10px!important}
.site-header .nav-wrap{border:0!important;box-shadow:none!important;border-radius:20px!important;background:transparent!important}
.site-header[data-header-theme="light"] .nav-wrap{background:rgba(255,252,247,.86)!important;backdrop-filter:blur(22px) saturate(1.12)!important;box-shadow:0 10px 34px rgba(50,30,18,.055)!important}
.site-header[data-header-theme="overlay"] .nav-wrap{background:linear-gradient(180deg,rgba(18,11,7,.15),rgba(18,11,7,.04))!important;backdrop-filter:blur(7px)!important}
.site-header.is-scrolled .nav-wrap,.site-header.scrolled .nav-wrap{background:rgba(255,252,247,.94)!important;box-shadow:0 13px 42px rgba(49,29,18,.09)!important;border:0!important}
.site-header .desktop-nav a{font-size:11px!important;letter-spacing:.02em!important;opacity:.82!important}.site-header .desktop-nav a.active,.site-header .desktop-nav a:hover{opacity:1!important}.site-header .desktop-nav a:after{height:1px!important;background:#9d6a49!important;bottom:6px!important}
.site-header .brand{transition:transform .2s}.site-header .brand:hover{transform:translateY(-1px)}
.site-header .menu-btn{border-radius:50%;transition:background .2s}.site-header .menu-btn:hover{background:rgba(104,67,45,.07)}
.mobile-menu{border:0!important;background:rgba(255,252,247,.98)!important;box-shadow:0 28px 70px rgba(49,29,18,.16)!important;backdrop-filter:blur(22px)!important}.mobile-menu>a{font:500 24px/1.2 var(--zi-serif)!important;padding:6px 2px!important}.mobile-menu-actions{border-top:1px solid rgba(92,57,38,.1);padding-top:16px!important}

/* =========================================================
   V4.2 — FULL-WIDTH HEADER + RELIABLE MOBILE DRAWER
   ========================================================= */
.site-header{
  top:0!important;
  padding:0!important;
  width:100%!important;
  background:transparent;
}
.site-header .nav-wrap{
  width:min(var(--zi-container),calc(100% - 44px))!important;
  height:82px!important;
  margin:0 auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
.site-header[data-header-theme="light"]{
  background:rgba(255,252,247,.94)!important;
  color:var(--zi-ink)!important;
  border-bottom:1px solid rgba(92,57,38,.08)!important;
  backdrop-filter:blur(22px) saturate(1.12)!important;
  box-shadow:0 12px 34px rgba(50,30,18,.045)!important;
}
.site-header[data-header-theme="overlay"]{
  background:linear-gradient(180deg,rgba(17,10,6,.36),rgba(17,10,6,0))!important;
  border:0!important;
  box-shadow:none!important;
}
.site-header.is-scrolled,.site-header.scrolled{
  background:rgba(255,252,247,.96)!important;
  color:var(--zi-ink)!important;
  border-bottom:1px solid rgba(92,57,38,.08)!important;
  box-shadow:0 14px 42px rgba(49,29,18,.07)!important;
}
.site-header.is-scrolled .nav-wrap,.site-header.scrolled .nav-wrap,
.site-header[data-header-theme="light"] .nav-wrap,
.site-header[data-header-theme="overlay"] .nav-wrap{
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  border-radius:0!important;
}
.header-create-space{
  min-height:44px!important;
  padding:0 20px!important;
  font-size:11px!important;
  white-space:nowrap;
  box-shadow:none!important;
}
.site-header[data-header-theme="overlay"]:not(.is-scrolled):not(.scrolled) .header-create-space{
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.58)!important;
  backdrop-filter:blur(12px)!important;
}
.mobile-menu-backdrop{display:none}
body.menu-open{overflow:hidden}
.menu-btn.is-open span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-btn.is-open span:last-child{transform:translateY(-3.5px) rotate(-45deg)}

@media(max-width:900px){
  .desktop-create-space{display:none!important}
  .site-header{height:72px!important;background:rgba(255,252,247,.95)!important;color:var(--zi-ink)!important;border-bottom:1px solid rgba(92,57,38,.07)!important;backdrop-filter:blur(20px)!important}
  .site-header .nav-wrap{width:calc(100% - 28px)!important;height:72px!important;padding:0!important;border-radius:0!important}
  .site-header[data-header-theme="overlay"]:not(.is-scrolled):not(.scrolled){background:linear-gradient(180deg,rgba(17,10,6,.42),rgba(17,10,6,.08))!important;color:#fff!important;border-bottom-color:transparent!important}
  .site-header[data-header-theme="overlay"]:not(.is-scrolled):not(.scrolled) .menu-btn span{background:#fff!important}
  .mobile-menu{
    display:grid!important;
    position:fixed!important;
    z-index:130!important;
    top:72px!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    align-content:start!important;
    gap:5px!important;
    padding:38px 28px max(34px,env(safe-area-inset-bottom))!important;
    background:rgba(255,252,247,.985)!important;
    color:var(--zi-ink)!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    backdrop-filter:blur(24px) saturate(1.08)!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px);
    transition:opacity .25s ease,transform .3s cubic-bezier(.22,1,.36,1),visibility .25s;
    overflow-y:auto;
  }
  .mobile-menu.open{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .mobile-menu>a{display:block!important;padding:13px 0!important;font:500 34px/1.06 var(--zi-serif)!important;border-bottom:1px solid rgba(92,57,38,.08)!important}
  .mobile-menu-actions{display:grid!important;gap:12px!important;margin-top:22px!important;padding-top:22px!important;border-top:0!important}
  .mobile-menu-actions>a:not(.btn){font-size:13px!important;padding:8px 0!important}
  .mobile-menu-actions .btn{width:100%!important;min-height:54px!important}
  .mobile-menu-backdrop{display:block;position:fixed;inset:72px 0 0;z-index:120;border:0;background:rgba(32,20,14,.20);backdrop-filter:blur(2px)}
  .mobile-menu-backdrop[hidden]{display:none!important}
  .menu-btn{position:relative;z-index:145}
}


/* V4.4 — MOBILE NAV + WEBP PERFORMANCE + COUPLE EDITORIAL */
@media(max-width:900px){
  .site-header{height:68px!important;background:rgba(255,252,247,.94)!important;color:var(--zi-ink)!important;border-bottom:1px solid rgba(91,56,35,.07)!important;backdrop-filter:blur(18px) saturate(1.08)!important}
  .site-header[data-header-theme="overlay"]:not(.is-scrolled):not(.scrolled){background:linear-gradient(180deg,rgba(16,10,7,.50),rgba(16,10,7,.08))!important;color:#fff!important;border-bottom:0!important;backdrop-filter:none!important}
  .site-header .nav-wrap{width:100%!important;height:68px!important;padding:0 18px!important;margin:0!important}
  .site-header .brand{min-width:auto!important}.site-header .brand b{font-size:27px!important}.site-header .brand small{font-size:5px!important;letter-spacing:.44em!important}
  .site-header .menu-btn{display:grid!important;place-items:center;width:44px!important;height:44px!important;padding:8px!important;border-radius:50%!important;background:rgba(255,255,255,.08)!important}
  .site-header.is-scrolled .menu-btn,.site-header[data-header-theme="light"] .menu-btn{background:rgba(92,57,38,.045)!important}
  .mobile-menu{display:none!important;position:fixed!important;inset:68px 0 0!important;width:100%!important;height:calc(100dvh - 68px)!important;z-index:140!important;padding:26px 22px max(28px,env(safe-area-inset-bottom))!important;background:linear-gradient(180deg,rgba(255,253,249,.995),rgba(250,243,235,.995))!important;color:var(--zi-ink)!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow-y:auto!important;grid-template-columns:1fr!important;align-content:start!important;gap:0!important}
  .mobile-menu.open{display:grid!important;animation:ziMobileMenuIn .34s cubic-bezier(.22,1,.36,1) both!important}
  @keyframes ziMobileMenuIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
  .mobile-menu:before{content:"";position:absolute;right:-92px;top:8%;width:270px;height:410px;background:var(--flair-b2) right top/contain no-repeat;opacity:.09;pointer-events:none}
  .mobile-menu-intro{position:relative;z-index:1;padding:7px 0 24px;border-bottom:1px solid rgba(92,57,38,.09);margin-bottom:7px}.mobile-menu-intro small{font:600 7px var(--zi-sans);letter-spacing:.34em;color:#a16d4d}.mobile-menu-intro p{margin:10px 0 0;font:400 29px/1 var(--zi-serif);letter-spacing:-.035em}.mobile-menu-intro em{font-weight:400;color:#9e6a49}
  .mobile-menu>a{position:relative;z-index:1;display:grid!important;grid-template-columns:34px 1fr!important;align-items:center!important;min-height:58px!important;padding:0!important;border-bottom:1px solid rgba(92,57,38,.07)!important;font:500 31px/1 var(--zi-serif)!important;letter-spacing:-.03em!important}
  .mobile-menu>a span{font:600 7px var(--zi-sans);letter-spacing:.12em;color:#b28a70}.mobile-menu>a.active{color:#9b6140!important}.mobile-menu>a.active:after{content:"";position:absolute;right:3px;width:7px;height:7px;border-radius:50%;background:#b67a51}
  .mobile-menu-actions{position:relative;z-index:1;display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:20px 0 0!important;padding:0!important}.mobile-menu-actions>a:not(.btn){min-height:46px;display:flex;align-items:center;font:500 12px var(--zi-sans)!important;border:0!important}.mobile-menu-actions .btn{min-height:56px!important;border-radius:16px!important;display:flex!important;justify-content:space-between!important;padding:0 20px!important}.mobile-menu-actions .btn b{font-size:18px;font-weight:400}
  .mobile-menu-signature{position:relative;z-index:1;margin-top:23px;font:400 26px var(--zi-script);color:#a77a5c;opacity:.75}
  .mobile-menu-backdrop{display:none!important}
}
.couple-cinema-slide img{object-position:center 35%;image-rendering:auto}
.portrait-chapter{padding:0 0 28px;background:linear-gradient(180deg,#fffaf4,#fffdf9 74%,#fbf3ea)}
.portrait-media{width:min(1440px,100%);height:min(82svh,980px);min-height:650px;margin:0 auto;border-radius:0 0 36px 36px;box-shadow:0 26px 80px rgba(51,31,20,.07)}
.portrait-media img{object-position:center 24%}
.portrait-copy{width:min(900px,88vw);padding:58px 0 104px}.portrait-copy h2{font-size:clamp(72px,8vw,118px)}.portrait-copy blockquote{max-width:760px;font-size:clamp(25px,2.45vw,38px);text-wrap:balance}.portrait-copy:after{content:"♡";display:block;margin:28px auto 0;color:#bb8554;font:400 25px var(--zi-serif)}
.love-sequence-v4{min-height:78svh}.love-sequence-inner{gap:92px}.love-letters span{font-size:clamp(78px,8.8vw,136px)}
@media(min-width:761px){
  .story-immersive-v4{padding:112px 0 138px}.storybook-shell-v4{width:min(1280px,94vw)}.storybook-v4{height:min(72svh,760px)!important;min-height:650px!important}.storybook-v4 .book-pages{inset:0 48px!important}.storybook-v4 .book-front{grid-template-columns:1.03fr .97fr!important}.storybook-v4 .book-photo{order:1!important;padding:30px 20px 30px 30px!important;background:linear-gradient(90deg,#fffdf9,#f7eee5)!important}.storybook-v4 .book-copy{order:2!important;padding:60px 58px 52px!important;background:linear-gradient(90deg,#f8eee5,#fffdf9 12%,#fffaf3)!important;text-align:left!important;display:flex!important;flex-direction:column!important;justify-content:center!important}.storybook-v4 .book-photo img{border-radius:8px!important;box-shadow:0 18px 50px rgba(52,31,20,.12)!important}.storybook-v4 .book-copy h3{font-size:clamp(44px,4.2vw,64px)!important;max-width:480px!important}.storybook-v4 .book-story-render{font-size:18px!important;line-height:1.72!important;max-width:520px!important}.storybook-v4 .book-spine{display:block!important;z-index:80!important;box-shadow:-12px 0 26px rgba(69,42,27,.08),12px 0 26px rgba(69,42,27,.08)!important}.storybook-v4 .book-front:before{content:"";position:absolute;inset:0 50% 0 auto;width:34px;transform:translateX(50%);background:linear-gradient(90deg,transparent,rgba(87,52,31,.08),rgba(255,255,255,.24),rgba(87,52,31,.07),transparent);pointer-events:none;z-index:8}
}
@media(max-width:760px){
  .portrait-media{height:74svh;min-height:520px;border-radius:0 0 26px 26px}.portrait-copy{width:90vw;padding:44px 0 72px}.portrait-copy h2{font-size:66px}.portrait-copy blockquote{font-size:23px}.love-sequence-v4{min-height:88svh}.love-sequence-inner{gap:30px}.love-letters span{font-size:72px}.story-immersive-v4{padding:64px 0 44px}.story-intro-v4{margin-bottom:20px}.storybook-v4{height:72svh!important;min-height:560px!important}.storybook-v4 .book-front{grid-template-columns:1fr 1fr!important}.storybook-v4 .book-photo{order:1!important;padding:9px 4px 9px 9px!important}.storybook-v4 .book-copy{order:2!important;padding:22px 13px 18px!important}.storybook-v4 .book-story-render{font-size:11.7px!important;line-height:1.5!important}.storybook-v4 .book-copy h3{font-size:25px!important}.storybook-v4 .book-photo img{border-radius:7px!important}.book-flip-face>.book-photo{padding:9px!important}.book-flip-face>.book-copy{padding:22px 13px!important}
}
