@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Sinhala:wght@400;500;600&family=Noto+Serif+Sinhala:wght@400;500;600&display=swap');

:root{--paper:#f8f4ed;--ink:#433f38;--muted:#8b8276;--rose:#a24e61;--line:#ded6c9;--serif:'Noto Serif Sinhala','Sinhala MN',serif;--sans:'Noto Sans Sinhala','Sinhala Sangam MN',sans-serif;--hand:var(--serif);color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit}a:focus-visible{outline:2px solid var(--rose);outline-offset:6px}::selection{background:#efd2d7}.page-grain{position:fixed;inset:0;z-index:10;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.site-header{height:112px;max-width:1360px;margin:auto;padding:0 72px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-family:var(--serif);font-style:normal;font-size:24px;text-decoration:none;letter-spacing:0}.wordmark span{font-family:var(--sans);font-style:normal;display:inline-block;font-size:25px;margin-left:9px;color:var(--rose)}.header-note{font-size:11px;letter-spacing:0;color:var(--muted)}.header-flower{color:#928b71;font-size:29px;font-weight:400}.hero{position:relative;max-width:1200px;margin:0 auto;min-height:800px;padding:91px 48px 122px;display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}.hero-copy{padding-bottom:17px}.eyebrow{font-size:12px;font-weight:500;letter-spacing:0;color:#827865;display:flex;align-items:center;gap:11px;margin:0 0 27px}.eyebrow>span{width:21px;height:1px;background:#9b8d70}h1{font-family:var(--serif);font-size:clamp(38px,4.4vw,60px);font-weight:400;line-height:1.65;letter-spacing:0;margin:0 0 27px}h1 em{font-weight:400;color:var(--rose)}.hero-description{font-size:14px;line-height:2.1;color:#82796e;margin:0 0 30px}.flower-composition{position:relative;width:100%;max-width:440px;justify-self:center;transform:rotate(3deg)}.flower-card{position:relative;background:linear-gradient(145deg,#fffcf6,#f6f0e8);border:1px solid #e8dfd2;box-shadow:3px 13px 26px #594c3210,0 2px 3px #594c3204;padding:22px 25px 24px;isolation:isolate}.card-topline{display:flex;align-items:center;justify-content:space-between;color:#9d9485;letter-spacing:0;font-size:11px}.card-topline>span:last-child{font-size:17px;color:#a08c80}.flower-halo{position:absolute;top:72px;left:9%;width:82%;aspect-ratio:1;border-radius:50%;background:radial-gradient(ellipse,#f4d3cf55,transparent 68%);transition:opacity 3s;opacity:.4;z-index:-1}.is-bloomed .flower-halo{opacity:1}.flower-art{width:100%;height:auto;overflow:visible;display:block;margin:-11px 0 -38px;transform:rotate(-3deg)}.flower-stem{animation:stem-arrive 1.8s ease both}.petal{transform:rotate(calc(-1 * var(--angle))) scale(.22,.53);transition:transform 3.5s cubic-bezier(.2,.65,.18,1);transition-delay:var(--delay);filter:url(#petal-shadow)}.is-bloomed .petal{transform:rotate(0deg) scale(1)}.flower-center{opacity:0;transform:scale(.2);transition:opacity 2.5s 1s,transform 3s 1s}.is-bloomed .flower-center{opacity:1;transform:scale(1)}.card-caption{display:flex;gap:18px;justify-content:center;align-items:center;margin-top:3px}.card-caption p{font-family:var(--serif);font-size:21px;margin:0;letter-spacing:0}.card-caption em{font-weight:400;color:var(--rose)}.tiny-star{color:#aa9c80;font-size:16px}.card-footnote{text-align:center;font-size:11px;letter-spacing:0;color:#9c9385;margin:17px 0 0}.handwritten{font-family:var(--hand);font-weight:400}.card-annotation{position:absolute;bottom:-59px;right:-34px;text-align:center;font-size:15px;line-height:1.9;color:#95816e;transform:rotate(-10deg)}.card-annotation span{color:var(--rose)}.annotation-arrow{position:absolute;bottom:-14px;right:125px;width:67px;height:54px;color:#b3a18c;transform:rotate(15deg)}.composition-spark{position:absolute;font-family:Georgia,serif;font-weight:400;color:#a89776}.spark-one{top:21%;left:-46px;font-size:36px;transform:rotate(-8deg)}.spark-two{right:-39px;bottom:26%;font-size:24px}.scroll-note{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-size:12px;letter-spacing:0;display:flex;align-items:center;gap:13px;text-decoration:none;white-space:nowrap;color:#9a8d7c}.scroll-note>span{font-size:18px;animation:nudge 3s ease-in-out infinite}.letter-section{max-width:900px;margin:20px auto 0;padding:35px 45px 0}.section-divider{display:flex;align-items:center;justify-content:center;gap:21px;color:var(--rose);font-size:22px;margin-bottom:40px}.section-divider>span:not(:nth-child(2)){height:1px;width:93px;background:var(--line)}.letter-eyebrow{justify-content:center;font-size:12px;letter-spacing:0;margin-bottom:36px}.letter-paper{position:relative;max-width:700px;background:#fffcf7;border:1px solid #e8e0d4;box-shadow:0 14px 45px #68553d06;padding:60px 73px 58px;margin:auto;transform:rotate(-.7deg)}.letter-paper:before{content:'';position:absolute;top:-12px;left:calc(50% - 50px);width:100px;height:27px;background:#dfd5c1;opacity:.55;transform:rotate(-4deg);clip-path:polygon(2% 0,98% 2%,100% 86%,95% 100%,3% 95%,0 15%)}.letter-corner{position:absolute;top:35px;right:36px;color:#bca587;font-size:31px}.letter-date{font-size:11px;letter-spacing:0;color:#a79a88;margin:0 0 28px}h2{font-size:27px;line-height:1.9;color:var(--rose);margin:0 0 24px}.letter-body{font-family:var(--serif);font-size:17px;line-height:2.15;color:#665b4e}.letter-body p{margin:0 0 23px}.letter-highlight{font-style:normal;color:var(--rose);font-size:21px;line-height:2;padding:4px 0 5px}.letter-signoff{margin-top:35px}.letter-signoff p{font-family:var(--serif);font-style:normal;font-size:15px;color:#8b7b68;margin-bottom:6px}.letter-signoff>.handwritten{font-size:25px;color:var(--rose)}.letter-signoff>.handwritten>span{font-size:25px;margin-left:6px}.paper-bottom-line{display:block;height:1px;background:#e7ded0;width:45px;margin-top:28px}.after-letter{text-align:center;padding:52px 0 57px}.after-letter>span{font-size:27px;color:#a18b6c}.after-letter>p{font-family:var(--serif);font-size:21px;line-height:2;margin:15px 0 20px}.after-letter>p>em{font-weight:400;color:#968573;font-size:17px}footer{border-top:1px solid var(--line);max-width:1216px;margin:auto;padding:31px 30px;display:flex;align-items:center;justify-content:space-between}footer .wordmark{font-size:23px}footer .wordmark span{font-size:17px}footer p{font-size:11px;letter-spacing:0;color:#948775}footer>span{font-family:var(--serif);color:#a68b82;font-size:16px}.floating-petal{position:absolute;left:var(--x);top:var(--y);width:12px;height:18px;background:#edb4bd;border-radius:80% 15% 75% 25%;pointer-events:none;opacity:0;animation:petal-drift 5s ease-out forwards;animation-delay:var(--wait);z-index:2}@keyframes petal-drift{10%{opacity:.7}to{transform:translate(var(--drift),230px) rotate(220deg);opacity:0}}@keyframes nudge{0%,70%,100%{transform:translateY(0)}85%{transform:translateY(5px)}}@keyframes stem-arrive{from{opacity:0}to{opacity:1}}
@media(min-width:1450px){.hero{padding-top:110px;padding-bottom:145px;min-height:870px}.flower-composition{max-width:456px}}
@media(max-width:1000px){.site-header{margin:0 30px;padding:0 15px;height:90px}.hero{gap:28px;padding:75px 60px 110px;min-height:720px}h1{font-size:46px}.flower-card{padding:18px 20px 21px}.card-caption{gap:12px}.card-caption p{font-size:18px}.card-footnote{font-size:10px;letter-spacing:0}.card-annotation{right:-10px;font-size:13px}.spark-one{left:-29px;font-size:26px}.spark-two{right:-26px}.letter-section{margin-top:0}footer{margin:0 30px}}
@media(max-width:700px){.site-header{height:80px;margin:0 24px;padding:0 1px}.wordmark{font-size:20px}.header-note{font-size:10px;letter-spacing:0;max-width:148px;text-align:center;line-height:1.6}.header-flower{font-size:24px}.hero{display:flex;flex-direction:column;padding:52px 27px 94px;gap:40px;min-height:0}.hero-copy{width:100%;text-align:center;padding:0}.eyebrow{justify-content:center;font-size:11px;letter-spacing:0;margin-bottom:23px}h1{font-size:clamp(26px,7.6vw,40px);line-height:1.8;letter-spacing:0;margin-bottom:22px}.hero-description{font-size:13px;margin-bottom:25px}.flower-composition{width:min(83%,340px);margin-bottom:18px;transform:rotate(3deg)}.flower-card{padding:18px 20px 22px}.flower-art{margin-top:-9px;margin-bottom:-29px}.card-topline{font-size:9px;letter-spacing:0}.card-caption p{font-size:19px}.card-footnote{font-size:10px;letter-spacing:0}.card-annotation{font-size:13px;bottom:-50px;right:-23px}.annotation-arrow{right:101px;bottom:-14px;width:56px}.spark-one{left:-31px}.spark-two{right:-28px;font-size:22px}.scroll-note{font-size:10px;letter-spacing:0;bottom:13px;gap:9px}.letter-section{padding:29px 21px 0}.section-divider{margin-bottom:28px}.letter-eyebrow{font-size:11px;letter-spacing:0;margin-bottom:30px}.letter-paper{padding:43px 28px 39px}.letter-corner{right:23px;top:23px;font-size:26px}.letter-date{font-size:10px;margin-bottom:26px;letter-spacing:0}h2{font-size:23px;margin-bottom:22px}.letter-body{font-size:16px;line-height:2.15}.letter-highlight{font-size:20px}.letter-signoff p{font-size:14px;line-height:2}.letter-signoff>.handwritten{font-size:23px}.after-letter{padding:43px 0 40px}.after-letter>p{font-size:20px}.after-letter>p>em{font-size:16px}footer{margin:0 23px;padding:24px 0;gap:20px}footer p{font-size:10px;line-height:1.9;text-align:right;max-width:145px}footer>span{display:none}footer .wordmark{white-space:nowrap;font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.floating-petal{display:none}.flower-stem{opacity:1}}

/* Sinhala needs generous line height and intact letter shaping. */
h1 > span, h1 > em { display: block; }
.wordmark { white-space: nowrap; }
em { font-style: normal; }
.hero > *, .hero-copy, .card-caption p { min-width: 0; }
.heart-note { display: flex; align-items: center; gap: 10px; font-size: 12px; line-height: 2; color: var(--rose); }
.heart-note > span { font-size: 24px; }
.scroll-note { margin: 0; text-align: center; max-width: 90%; white-space: normal; line-height: 1.9; }
.card-caption { gap: 10px; }
.card-caption p { line-height: 1.8; }
.card-annotation { bottom: -65px; }
.letter-eyebrow, .letter-date { line-height: 2; }
.letter-body p { text-wrap: pretty; }
.is-opening .hero-copy > :not(h1) { animation: text-arrive 1.2s ease both; }
.is-opening h1 > * { animation: text-arrive 1.4s ease both; }
.is-opening h1 > :nth-child(1) { animation-delay: .2s; }
.is-opening h1 > :nth-child(2) { animation-delay: .5s; }
.is-opening h1 > :nth-child(3) { animation-delay: .8s; }
.is-opening .hero-copy > .hero-description { animation-delay: 1.2s; }
.is-opening .hero-copy > .heart-note { animation-delay: 1.7s; }
.is-opening .flower-composition { animation: card-arrive 1.4s ease both; }
.is-opening .composition-spark { animation: sparkle 4s ease-in-out infinite; }
.letter-paper.will-reveal > :not(.letter-body), .letter-paper.will-reveal .letter-body > p { opacity: 0; }
.letter-paper.is-revealed > :not(.letter-body), .letter-paper.is-revealed .letter-body > p { animation: text-arrive 1.1s ease both; }
.letter-paper.is-revealed .letter-body > :nth-child(2) { animation-delay: .15s; }
.letter-paper.is-revealed .letter-body > :nth-child(3) { animation-delay: .3s; }
.letter-paper.is-revealed .letter-body > :nth-child(4) { animation-delay: .45s; }
.letter-paper.is-revealed .letter-body > :nth-child(5) { animation-delay: .6s; }
.letter-paper.is-revealed .letter-body > :nth-child(6) { animation-delay: .75s; }
.letter-paper.is-revealed .letter-signoff { animation-delay: .9s; }
@keyframes text-arrive { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes card-arrive { from { opacity: 0; transform: translateY(18px) rotate(5deg); } to { opacity: 1; transform: translateY(0) rotate(3deg); } }
@keyframes sparkle { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (max-width: 700px) {
  .site-header { height: 74px; }
  .hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; padding: 25px 24px 70px; text-align: center; }
  .hero-copy { display: contents; }
  .hero-copy > .eyebrow { order: 0; margin-bottom: 10px; }
  h1 { order: 1; margin-bottom: 22px; }
  h1 > span:nth-child(2), h1 > em { display: inline-block; }
  h1 > span:nth-child(2) { margin-right: .25em; }
  .flower-composition { order: 2; width: min(78%, 280px); margin: 0 auto 75px; }
  .hero-description { order: 3; margin: 0 0 12px; }
  .heart-note { order: 4; justify-content: center; font-size: 11px; margin: 0; }
  .scroll-note { bottom: 18px; width: 90%; justify-content: center; }
  .card-annotation { bottom: -58px; right: -20px; }
  .letter-paper { padding: 43px 24px 39px; }
  .letter-corner { font-size: 22px; top: 18px; right: 17px; }
  .letter-date { margin-bottom: 22px; }
  .header-note { max-width: 142px; }
  footer { gap: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .letter-paper.will-reveal > :not(.letter-body), .letter-paper.will-reveal .letter-body > p { opacity: 1; }
}
@media (max-width: 360px) {
  .header-note { max-width: 120px; font-size: 9px; }
  .card-caption p { font-size: 15px; }
}