/* TOKENS — postcard palette */
:root{--cream:#Fdfbf7;--cream-dark:#F5EDDA;--blush:#F7C8D3;--rosewood:#B46A72;--rosewood-d:#8B4F56;--sage:#A8B58A;--sky:#A9B7C6;--midnight:#2D3A47;--ink:#2D3A47;--ink-60:rgba(45,58,71,0.60);--ink-35:rgba(45,58,71,0.35);--ink-15:rgba(45,58,71,0.15);--paper:rgba(255,247,230,0.95);--ff-serif:'Cormorant Garamond',Georgia,serif;--ff-sans:'Inter',system-ui,sans-serif;--ff-script:'Dancing Script',cursive;--ease:cubic-bezier(0.16,1,0.3,1)}
/* RESET & PAPER BACKGROUND */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--ff-sans);font-weight:300;color:var(--ink);line-height:1.85;overflow-x:hidden;cursor:none;-webkit-font-smoothing:antialiased;background-color:var(--cream);
background-image:radial-gradient(circle at center,transparent 30%,rgba(180,106,114,0.06) 100%),url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.08'/%3E%3C/svg%3E");
background-attachment:fixed;min-height:100vh}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
a{color:inherit;text-decoration:none;cursor:none}
img{display:block;max-width:100%}
/* SCATTERED BACKGROUND EMOJIS */
.bg-deco{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:-1;overflow:hidden}
.bg-deco span{position:absolute;font-size:28px;opacity:.55;filter:grayscale(15%) sepia(20%)}
/* HERO MOUNT — scrapbook style */
.hero-mount{position:relative;background:var(--paper);padding:40px;box-shadow:0 8px 20px rgba(180,106,114,0.12);transform:rotate(-1deg);display:flex;align-items:center;gap:30px;max-width:800px;margin:40px auto}
.hero-content-left{flex:0 0 300px}
.hero-content-left img{width:100%;height:auto;border-radius:2px}
.hero-content-right{flex:1;text-align:left}
@media(max-width:768px){.hero-mount{flex-direction:column;text-align:center}.hero-content-right{text-align:center}}
.tape{position:absolute;top:-12px;left:50%;transform:translateX(-50%) rotate(1deg);width:90px;height:26px;background:rgba(255,255,255,0.6);border:1px solid rgba(180,106,114,0.15);z-index:10}
.hero-h1{font-family:var(--ff-serif);font-size:32px;color:var(--rosewood);margin-bottom:10px}
.hero-sub{font-family:var(--ff-serif);font-style:italic;color:var(--ink-60);margin-bottom:15px}
.hero-body{font-size:14px;color:var(--ink-60);line-height:1.6}
.deco-l{position:absolute;top:15px;left:-20px;font-size:22px}
.deco-r{position:absolute;bottom:20px;right:-20px;font-size:22px;color:var(--rosewood)}
.hero-mount-ph{display:none}
/* CURSOR */
#cur{position:fixed;top:0;left:0;pointer-events:none;z-index:9999;width:0;height:0;will-change:transform}
#cur-bear{position:absolute;font-size:17px;line-height:1;transform:translate(-50%,-50%);user-select:none;white-space:nowrap;transition:font-size .22s var(--ease)}
#cur-halo{position:absolute;width:36px;height:36px;border-radius:50%;border:1px solid rgba(180,106,114,.5);transform:translate(-50%,-50%);transition:width .3s var(--ease),height .3s var(--ease)}
body.hov #cur-bear{font-size:21px}
body.hov #cur-halo{width:50px;height:50px;border-color:rgba(180,106,114,.9)}
/* PARTICLE CANVAS */
#pc{position:fixed;inset:0;pointer-events:none;z-index:9998}
/* NAV — ink on paper */
nav{position:sticky;top:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:20px 52px;background:rgba(253,251,247,0.88);border-bottom:1px solid rgba(180,106,114,0.15);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.nav-logo{font-family:var(--ff-serif);font-size:15px;font-weight:300;letter-spacing:.1em;color:var(--rosewood);cursor:none}
.nav-menu{display:flex;gap:36px;list-style:none}
.nav-menu a{font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-60);transition:color .2s;cursor:none}
.nav-menu a:hover,.nav-menu a.active{color:var(--rosewood)}
.nav-soon{font-size:9px;font-style:italic;letter-spacing:.1em;opacity:.5;margin-left:4px}
.nav-ham{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:none;padding:4px}
.nav-ham span{display:block;width:20px;height:1px;background:var(--rosewood);transition:all .3s}
@media(max-width:768px){nav{padding:16px 20px}.nav-ham{display:flex}.nav-menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:rgba(253,251,247,0.97);border-bottom:1px solid rgba(180,106,114,.2)}.nav-menu.open{display:flex}.nav-menu li{border-bottom:1px solid rgba(180,106,114,.1)}.nav-menu a{display:block;padding:14px 20px}}
/* HERO TEXT */
.hero{max-width:960px;margin:0 auto;padding:60px 40px 80px;text-align:center}
.hero-h1{font-family:var(--ff-serif);font-size:clamp(38px,5vw,64px);font-weight:300;line-height:1.05;color:var(--rosewood);margin-bottom:16px}
.hero-sub{font-family:var(--ff-serif);font-size:clamp(16px,2vw,21px);font-weight:300;font-style:italic;color:var(--ink-60);margin-bottom:20px}
.hero-body{font-size:14px;line-height:1.9;color:var(--ink-60);max-width:520px;margin:0 auto}
/* SECTION SHARED */
.section-wrap{max-width:1100px;margin:0 auto;padding:60px 40px 96px}
@media(max-width:768px){.section-wrap{padding:48px 20px 72px}}
.section-eyebrow{font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--sage);text-align:center;margin-bottom:8px}
.section-heading{font-family:var(--ff-serif);font-size:clamp(28px,4vw,44px);font-weight:300;color:var(--rosewood);text-align:center;margin-bottom:48px}
/* GALLERY — 5-column mini postcard grid */
.postcard-grid{columns:5;column-gap:16px}
@media(max-width:900px){.postcard-grid{columns:4}}
@media(max-width:600px){.postcard-grid{columns:2}}
.pc-card{break-inside:avoid;margin-bottom:16px;display:inline-block;width:100%;cursor:none}
.pc-inner{background:#fff;padding:6px 6px 24px;box-shadow:0 4px 16px rgba(180,106,114,.06),0 1px 3px rgba(45,58,71,.03);position:relative;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.pc-card:nth-child(3n+1) .pc-inner{transform:rotate(-1.5deg)}
.pc-card:nth-child(3n+2) .pc-inner{transform:rotate(1deg)}
.pc-card:nth-child(3n+3) .pc-inner{transform:rotate(-0.8deg)}
.pc-card:nth-child(5) .pc-inner{transform:rotate(1.8deg)}
.pc-card:nth-child(8) .pc-inner{transform:rotate(-2deg)}
.pc-card:nth-child(11) .pc-inner{transform:rotate(1.2deg)}
.pc-card:hover .pc-inner{transform:rotate(0deg) translateY(-4px) scale(1.04);box-shadow:0 12px 30px rgba(180,106,114,.1),0 2px 6px rgba(45,58,71,.04)}
.pc-img{width:100%;height:auto;display:block;object-fit:cover;filter:saturate(1.04) brightness(.97);transition:filter .4s}
.pc-card:hover .pc-img{filter:saturate(1.1) brightness(1.02)}
.pc-ph{display:none;width:100%;min-height:100px;align-items:center;justify-content:center;font-family:var(--ff-serif);font-style:italic;font-size:10px;color:var(--ink-35);text-align:center;padding:8px}
.pc-stamp{position:absolute;top:-6px;right:-5px;width:20px;height:26px;background:var(--sage);border:2px solid #fff;box-shadow:0 2px 4px rgba(45,58,71,.1);display:flex;align-items:center;justify-content:center;font-size:8px;transform:rotate(4deg);opacity:0;transition:opacity .3s}
.pc-card:hover .pc-stamp{opacity:1}
.pc-card:nth-child(5n+1) .pc-img{min-height:120px;object-fit:cover}
.pc-card:nth-child(5n+2) .pc-img{min-height:90px;object-fit:cover}
.pc-card:nth-child(5n+3) .pc-img{min-height:110px;object-fit:cover}
.pc-card:nth-child(5n+4) .pc-img{min-height:100px;object-fit:cover}
.pc-card:nth-child(5n+5) .pc-img{min-height:130px;object-fit:cover}
/* SPACES — postcard tiles */
.spaces-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
@media(max-width:768px){.spaces-grid{grid-template-columns:1fr}}
.space-tile{display:block;text-decoration:none;color:inherit;cursor:none;position:relative}
.space-tile-inner{background:#fff;padding:36px 32px 32px;position:relative;overflow:hidden;box-shadow:0 4px 24px rgba(180,106,114,.05),0 1px 4px rgba(45,58,71,.03);transition:transform .4s var(--ease),box-shadow .4s var(--ease);background-image:repeating-linear-gradient(transparent,transparent 27px,rgba(180,106,114,0.06) 27px,rgba(180,106,114,0.06) 28px);background-position:0 48px}
.space-tile:hover .space-tile-inner{transform:translateY(-5px) rotate(-0.3deg);box-shadow:0 16px 44px rgba(180,106,114,.08),0 2px 8px rgba(45,58,71,.04)}
.space-stamp{position:absolute;top:16px;right:16px;width:38px;height:46px;border:1.5px solid var(--sage);display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--sage);transform:rotate(2deg)}
.space-stamp::before{content:'';position:absolute;inset:3px;border:1px dashed rgba(168,181,138,.4)}
.space-postmark{position:absolute;top:12px;right:64px;font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--rosewood);opacity:.35;font-weight:500}
.space-platform{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);font-weight:500;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.space-title{font-family:var(--ff-serif);font-size:clamp(20px,2.8vw,32px);font-weight:300;line-height:1.15;color:var(--rosewood);margin-bottom:16px;transition:color .2s}
.space-tile:hover .space-title{color:var(--rosewood-d)}
.space-desc{font-size:13px;line-height:1.85;color:var(--ink-60);margin-bottom:24px}
.space-cta{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--rosewood);opacity:.7;display:inline-flex;align-items:center;gap:8px;transition:gap .2s,opacity .2s}
.space-tile:hover .space-cta{gap:14px;opacity:1}
.space-cta::after{content:'→'}
/* FOOTER */
footer{text-align:center;padding:64px 24px 52px;border-top:1px solid rgba(180,106,114,.1)}
.footer-logo-wrap{margin-bottom:16px}
.footer-logo-wrap img{height:100px;width:auto;display:block;margin:0 auto;opacity:.85;mix-blend-mode:multiply}
.footer-logo-text{font-family:var(--ff-serif);font-size:clamp(22px,3vw,36px);font-weight:300;font-style:italic;color:var(--rosewood);display:none}
.footer-copy{font-size:10px;letter-spacing:.12em;color:var(--ink-35)}
/* SCROLL REVEAL */
.rev{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rev.in{opacity:1;transform:none}
.rev[data-delay="1"]{transition-delay:.08s}
.rev[data-delay="2"]{transition-delay:.16s}
.rev[data-delay="3"]{transition-delay:.24s}

/* ═══ NEW: shared page intro (messages + poems) ═══ */
.page-intro{max-width:520px;margin:-24px auto 48px;text-align:center;font-size:14px;line-height:1.9;color:var(--ink-60)}

/* ═══ NEW: MESSAGE BOX — same postcard-tile look as "Spaces" ═══ */
.msg-card{max-width:640px;margin:0 auto;position:relative}
.msg-card .space-tile-inner{padding:44px 36px 36px}
.msg-card:hover .space-tile-inner{transform:none}
.msg-label{display:block;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);font-weight:500;margin-bottom:8px}
.msg-field{margin-bottom:24px}
.msg-card textarea,.msg-card input[type="text"]{width:100%;font-family:var(--ff-serif);font-size:19px;font-weight:400;line-height:28px;color:var(--ink);background:transparent;border:none;border-bottom:1px solid rgba(180,106,114,.25);padding:4px 2px;outline:none;resize:vertical;cursor:none;transition:border-color .2s}
.msg-card textarea{min-height:168px}
.msg-card textarea:focus,.msg-card input[type="text"]:focus{border-bottom-color:var(--rosewood)}
.msg-card ::placeholder{color:var(--ink-35);font-style:italic}
.msg-count{text-align:right;font-size:10px;letter-spacing:.12em;color:var(--ink-35);margin-top:4px}
.msg-btn{font-family:var(--ff-sans);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--rosewood);background:transparent;border:1.5px solid var(--rosewood);padding:12px 28px;cursor:none;opacity:.8;transition:opacity .2s,background .2s,color .2s}
.msg-btn:hover{opacity:1;background:var(--rosewood);color:#fff}
.msg-btn:disabled{opacity:.4}
.msg-note{font-size:11px;color:var(--ink-35);margin-top:18px;line-height:1.7}
.msg-status{margin-top:20px;font-family:var(--ff-serif);font-style:italic;font-size:18px;color:var(--rosewood-d);display:none}
.msg-status.err{color:var(--rosewood)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ═══ NEW: POEMS — same postcard-tile look as "Spaces" ═══ */
.poems-list{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:36px}
.poem .space-tile-inner{padding:44px 36px 36px}
.poem:hover .space-tile-inner{transform:none}
.poem-title{font-family:var(--ff-serif);font-size:clamp(24px,3vw,32px);font-weight:300;line-height:1.15;color:var(--rosewood);margin-bottom:6px}
.poem-date{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);font-weight:500;margin-bottom:20px}
.poem-body{font-family:var(--ff-serif);font-size:19px;line-height:28px;color:var(--ink)}
.poem-body p{margin-bottom:28px;white-space:pre-line}
.poem-body p:last-child{margin-bottom:0}