/* Palette interpreted from Camryn's supplied business-card artwork. */
body { background: #fbf8fc; isolation: isolate; }
body::before { content: ''; position: fixed; z-index: -1; inset: 0; pointer-events: none; background: linear-gradient(125deg,#f4e9fc,#fbe5ef,#fcf1d9,#e8f7f1,#e8eaf9,#f3e4f5); background-size: 400% 400%; animation: brand-flow 30s ease-in-out infinite; opacity: .9; }
@keyframes brand-flow { 0%,100% { background-position: 0% 45%; } 50% { background-position: 100% 55%; } }
.wrap { width: min(1260px,calc(100% - 112px)); }
.brand { gap: 11px; }
.brand-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 15px 15px 15px 5px; background: linear-gradient(135deg,var(--violet),var(--midnight)); color: #fff; box-shadow: 0 4px 15px #783da625; }
.brand-symbol .icon { width: 27px; height: 27px; }
.brand-name { font-size: 25px; letter-spacing: -.8px; }
.brand-by { color: var(--clay); font-weight: 700; font-size: 9px; letter-spacing: .2em; }
.site-nav { padding: 25px 0; border-bottom-color: #783da622; }
.site-nav .brand--wordmark { width: 270px; max-width: calc(100% - 52px); min-width: 0; flex-shrink: 1; line-height: 0; }
.site-nav .brand--wordmark img { width: 100%; height: auto; }
.site-nav:has(.brand--wordmark) { position: relative; padding: 16px 0; }
.nav-links { gap: 28px; font-size: 15px; font-weight: 600; }
.nav-links .btn { margin-left: 10px; font-size: 14px; padding: 13px 22px; }
.btn { border-radius: 100px; background: var(--green); border-color: var(--green); padding: 15px 25px; box-shadow: 0 5px 14px #783da619; }
.btn:hover { background: var(--midnight); border-color: var(--midnight); }
.btn.secondary { box-shadow: none; background: #ffffff88; color: var(--green); }
.btn.secondary:hover { background: var(--sage); border-color: #baa1cc; }
.btn.danger { color: #a13e32; border-color: #e8c2bc; background: #fff; box-shadow: none; }
.text-link { border-color: #783da63b; }
.eyebrow { color: var(--green); font-size: 10px; letter-spacing: .15em; }
.hero { gap: 54px; padding: 48px 0 42px; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); }
.hero-copy .eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 25px; font-size: 9px; max-width: none; }
.eyebrow-spark { font-size: 21px; color: var(--clay); }
.hero-copy h1 { font-size: clamp(55px,5.9vw,85px); letter-spacing: -.055em; line-height: 1.01; margin-bottom: 25px; }
.hero-copy h1 > span { display: block; }
.headline-color { color: var(--green); background: linear-gradient(110deg,#492267,#993f8d,#382454); background-clip: text; -webkit-text-fill-color: transparent; }
.hero-copy > p:not(.eyebrow) { font-size: 15px; line-height: 1.8; max-width: 390px; }
.hero-actions { margin-top: 30px; gap: 22px; flex-wrap: wrap; }
.hero-note { margin-top: 28px; gap: 8px; flex-wrap: wrap; font-size: 10px; }
.hero-note span { border: 0; padding: 6px 10px; border-radius: 100px; background: #fff9; }
.hero-art { padding: 25px 4px 18px; min-width: 0; }
.orbit-word { font-size: 10px; font-weight: 600; letter-spacing: .035em; color: var(--clay); position: absolute; top: 2px; right: 25px; transform: rotate(4deg); }
.hero-photo { margin: 0; padding: 13px 13px 0; border: 1px solid #fff; background: #fffdfb; border-radius: 20px; box-shadow: 0 18px 70px #4c29601d; transform: rotate(3deg); position: relative; }
.hero-photo-window { height: clamp(440px,44vw,600px); overflow: hidden; border-radius: 12px; position: relative; background: linear-gradient(135deg,#f3d8eb,#e1d6f7,#d2e8ed); }
.hero-photo-window > img { width: 100%; height: 100%; object-fit: cover; }
.hero-photo.sample-photo .hero-photo-window > img { object-fit: contain; }
.photo-sticker { position: absolute; bottom: 16px; left: 14px; display: inline-flex; gap: 7px; align-items: center; padding: 8px 12px; font-size: 9px; font-weight: 700; letter-spacing: .07em; background: #fffdfbe8; color: var(--midnight); border-radius: 7px; transform: rotate(-5deg); }
.hero-photo > figcaption { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 18px 5px 19px; }
.hero-photo figcaption .eyebrow { font-size: 8px; letter-spacing: .1em; display: block; }
.hero-photo figcaption strong { display: block; font: 23px/1.3 var(--serif); margin-top: 4px; }
.hero-photo figcaption p { font-size: 10px; margin-top: 5px; }
.hero-photo figcaption > .icon { color: var(--clay); width: 24px; height: 24px; }
.hero-spark { position: absolute; z-index: 2; font-family: var(--serif); pointer-events: none; }
.spark-one { color: var(--gold); font-size: 75px; top: -6px; left: -22px; text-shadow: 0 2px #fff; }
.spark-two { color: var(--violet); font-size: 60px; bottom: 17px; right: -20px; }
.handwritten-note { display: block; font: italic 14px var(--serif); color: var(--clay); margin: 17px 0 0 6px; transform: rotate(-3deg); }
.handwritten-note > span { font-size: 27px; }
.hero-photo:has(.cover-controls) > figcaption { align-items: stretch; flex-direction: column; gap: 14px; }
.cover-controls { display: flex; gap: 8px; align-items: center; padding-top: 10px; border-top: 1px solid var(--line); }
.cover-controls [data-cover-step='-1'] .icon { transform: rotate(180deg); }
.cover-controls .icon-btn { min-width: 44px; height: 44px; background: #f3eaf9; padding: 10px; border: 1px solid #e3d5ed; }
.cover-controls .icon-btn:hover,.journal-controls .icon-btn:hover { background: #e9d9f3; }
.cover-controls #cover-pause { margin-left: auto; width: auto; padding: 10px 15px; font-size: 12px; white-space: nowrap; }
.cover-controls #cover-pause[aria-pressed='true'] { background: var(--violet); border-color: var(--violet); color: #fff; }
#cover-count { font-size: 11px; min-width: 35px; text-align: center; white-space: nowrap; }
.photo-awaiting { display: flex; flex-direction: column; gap: 20px; align-items: center; justify-content: center; height: 100%; color: var(--violet); }
.section { padding: 80px 0; }
.section-heading h2,.journal-heading h2 { font-size: clamp(36px,4vw,54px); }
.journal-heading { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 50px; margin-bottom: 35px; }
.journal-heading h2 { margin-top: 12px; max-width: 600px; }
.journal-heading > div:last-child > p { font-size: 13px; line-height: 1.8; }
.journal-label { display: inline-flex; gap: 7px; align-items: center; margin-top: 13px; color: var(--green); font-size: 10px; font-weight: 600; }
.journal-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; align-items: start; gap: 22px; }
.journal-photo { margin: 0; min-width: 0; }
.journal-photo[hidden] { display: none; }
.journal-photo:nth-child(3n+2) { margin-top: 35px; }
.photo-open { width: 100%; display: block; border: 9px solid #fffdfb; padding: 0; border-radius: 14px; background: #eee1f4; position: relative; box-shadow: 0 5px 23px #4c296013; overflow: hidden; }
.photo-open img { width: 100%; height: 290px; object-fit: cover; transition: transform .45s; }
.journal-photo:nth-child(3n+1) .photo-open img { height: 350px; }
.sample-photo .photo-open img { object-fit: contain; background: #f2edf6; }
.photo-open:hover img { transform: scale(1.04); }
.photo-enlarge { position: absolute; bottom: 10px; right: 10px; background: #fff; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: var(--green); }
.journal-photo figcaption { display: flex; gap: 10px; align-items: baseline; font-size: 12px; color: var(--ink); padding: 13px 4px; }
.photo-number { font: italic 16px var(--serif); color: var(--clay); }
.journal-photo figcaption > span:nth-child(2) { flex: 1; }
.journal-photo figcaption small { font-size: 9px; color: var(--muted); }
.journal-more { margin: 25px auto 0; display: flex; }
.photo-lightbox { margin: 0; }
.photo-lightbox img { width: 100%; max-height: 65vh; object-fit: contain; border-radius: 8px; }
.photo-lightbox figcaption { margin-top: 14px; font-size: 14px; color: var(--muted); }
.journal-controls { display: flex; justify-content: center; align-items: center; gap: 18px; margin-top: 18px; }
.journal-controls .icon-btn { width: 44px; height: 44px; }
.journal-controls #journal-prev .icon { transform: rotate(180deg); }
#journal-count { min-width: 50px; text-align: center; font-size: 12px; }
.photo-timing { margin-top: 12px; }
.program-card { border: 1px solid #fff; box-shadow: 0 6px 25px #4c29600c; border-radius: 16px; background: #fffafde0; }
.program-image { height: 180px; background: #eee1f4; }
.program-copy { padding: 26px; }
.program-copy .eyebrow { color: var(--clay); }
.about-section { background: #f1e9f2a6; border-top: 1px solid #fff; border-bottom: 1px solid #fff; }
.about-image { border: 10px solid #fff; transform: rotate(-2deg); box-shadow: 0 10px 35px #4c29600c; height: 400px; }
.review-card,.pricing-card { border-color: #fff; background: #fffcfbea; box-shadow: 0 7px 25px #4c29600d; border-radius: 18px; }
.stars { color: #9f5d20; }
.cta-band { position: relative; overflow: hidden; background: linear-gradient(125deg,#3d2859,#693382,#833769,#3d3265); background-size: 300% 300%; animation: brand-flow 30s ease-in-out infinite; border-radius: 25px; padding: 54px 60px; }
.cta-band p { color: #eaddf5; }
.cta-band .btn { background: #fff8ef; color: var(--midnight); z-index: 1; }
.cta-spark { position: absolute; color: #e4b85b33; font-size: 210px; left: 47%; top: -75px; pointer-events: none; }
.footer { font-size: 12px; border-color: #783da622; }
.footer-contact p { max-width: 240px; }
.form-shell { border-color: #fff; border-radius: 22px; background: #fffdfbef; box-shadow: 0 8px 40px #4c296010; }
.field input,.field textarea,.field select { border-color: #ddd0e4; border-radius: 9px; }
.page-intro h1 { font-size: clamp(43px,5.5vw,67px); }
.privacy-note { color: var(--muted); }
.success-panel .success-icon { color: var(--green); }
body:has(.dashboard) { background: #f6f3f8; }
body:has(.dashboard)::before { opacity: .3; }
.sidebar { background: #fffdfd; color: var(--ink); border-right: 1px solid var(--line); width: 238px; padding: 28px 22px; }
.sidebar .brand-name { font-size: 21px; }
.sidebar .brand-by { color: var(--clay); }
.sidebar .brand-symbol { width: 36px; height: 36px; border-radius: 12px 12px 12px 4px; }
.sidebar .brand-symbol .icon { width: 22px; height: 22px; }
.sidebar .brand { color: var(--ink); gap: 9px; }
.side-label { color: var(--muted); font-size: 9px; letter-spacing: .14em; margin-top: 12px; }
.side-nav { gap: 5px; }
.side-nav button { color: #6e637c; padding: 12px 13px; border-radius: 11px; font-size: 12px; }
.side-nav button:hover { color: var(--green); background: #f4eefa; }
.side-nav button.active { color: var(--green); background: #eee4f7; font-weight: 700; box-shadow: inset 3px 0 var(--green); }
.side-nav button .pill { background: #e9d3f4; color: var(--green); }
.sidebar-foot { border-color: var(--line); }
.sidebar-foot a,.sidebar-foot button,.sidebar-foot p { color: var(--muted); }
.sidebar-foot a:hover,.sidebar-foot button:hover { color: var(--green); }
.dashboard { grid-template-columns: 238px minmax(0,1fr); background: linear-gradient(140deg,#f8f2fb,#f7f4f9 45%,#faf5f7); }
.dashboard-main { margin-left: 0; }
.dash-top { background: #fffdfdbf; backdrop-filter: blur(15px); border-bottom-color: var(--line); }
.avatar { background: linear-gradient(130deg,#ead8f4,#f3dce8); color: var(--green); }
.dash-content { padding: 34px 36px; }
.dash-heading h1 { font-size: 40px; }
.dash-heading p { font-size: 12px; margin-top: 10px; }
.stat { border-radius: 16px; border-color: #ebe1f0; box-shadow: 0 3px 12px #4c296004; }
.stat .stat-value { color: var(--midnight); }
.stats-grid .stat:first-child { border-top: 3px solid var(--violet); }
.stats-grid .stat:nth-child(2) { border-top: 3px solid var(--pink); }
.stats-grid .stat:nth-child(3) { border-top: 3px solid var(--teal); }
.stats-grid .stat:nth-child(4) { border-top: 3px solid var(--gold); }
.panel { border-radius: 16px; border-color: #ebe1f0; background: #fffdfd; box-shadow: 0 3px 18px #4c296005; overflow: hidden; }
.panel-head h2 { font-family: var(--sans); font-size: 15px; font-weight: 600; letter-spacing: -.02em; }
.quick-action { background: #fbf7fd; border-radius: 11px; }
.quick-action:hover { background: #f0e6f8; border-color: #d7bee5; }
.tabbar { gap: 5px; border: 0; padding: 4px; border-radius: 13px; background: #eee7f2; width: fit-content; max-width: 100%; }
.tabbar button { border: 0; border-radius: 9px; font-size: 11px; padding: 10px 14px; background: transparent; color: var(--muted); }
.tabbar button.active { background: #fff; color: var(--green); box-shadow: 0 2px 6px #4c29600e; }
.tabbar[hidden] { display: none; }
.upload-box.dragging { background: #ead9f5; border-style: solid; }
.editor-head-actions { flex-wrap: wrap; }
.editor-layout { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 22px; }
.editor-fields { padding: 27px; }
.editor-fields h3 { font: 26px var(--serif); }
.preview-panel { background: #f0e7f7; border: 1px solid #e7d9ef; border-radius: 16px; overflow: hidden; }
.preview-tools { background: #fffafc; font-size: 10px; }
.preview-frame { width: 100%; border-radius: 0 0 15px 15px; }
.preview-frame.mobile { max-width: 390px; margin: 15px auto; border-radius: 16px; border: 6px solid #34263f; }
.editor-card { border-color: #e9dfef; border-radius: 13px; background: #fdfafd; }
.editor-card h4 { margin: 0; font-weight: 600; }
.icon-btn { color: var(--green); border-color: var(--line); border-radius: 8px; background: #fff; }
.photo-workflow { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-bottom: 20px; }
.photo-cover-setting { padding: 13px 0 18px; }
.photo-cover-setting .text-link { margin-top: 8px; font-size: 11px; }
.photo-workflow > div { display: flex; gap: 9px; align-items: center; font-size: 11px; color: var(--muted); }
.photo-workflow b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #eadcf5; color: var(--green); font-size: 10px; flex: none; }
.photo-prompt { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 23px; border: 1px solid #dbc9e8; border-radius: 15px; background: linear-gradient(120deg,#efe5fa,#faeaf2,#fff3dd); margin-bottom: 24px; }
.photo-prompt strong { display: block; font: 24px var(--serif); }
.photo-prompt p { font-size: 12px; margin-top: 6px; }
.upload-box { border: 2px dashed #c8a4df; border-radius: 15px; padding: 28px 20px; background: linear-gradient(130deg,#f4ecfb,#fff5f8); }
.upload-box > .icon { color: var(--green); width: 28px; height: 28px; margin-bottom: 10px; }
.upload-box strong { font-size: 17px; }
.upload-box input { max-width: 100%; font-size: 12px; margin-top: 14px; }
.upload-box input::file-selector-button { background: var(--green); color: white; border: 0; border-radius: 100px; padding: 10px 16px; margin-right: 10px; cursor: pointer; font: 600 12px var(--sans); }
.photo-edit > img { width: 100%; max-height: 235px; object-fit: cover; border-radius: 9px; margin-bottom: 15px; }
.photo-editor-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.brand-palette { display: flex; gap: 8px; margin: 18px 0 8px; }
.brand-palette span { width: 30px; height: 30px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 1px #e7dbea; }
.empty { border-color: #d9c3e6; background: #fdf9ff; }
.empty h3 { font-size: 24px; }
.notice,.financial-note { background: #efe8f5; color: #65516f; border-color: #dfcfe9; }
dialog { background: #fffafc; border-color: #e1cfe9; border-radius: 18px; }
.close-btn { color: var(--midnight); }
.check input { accent-color: var(--green); }
.chart-bars .expense,.chart-legend .expense { background: var(--pink); }
@media (max-width:1050px) {
  .wrap { width: calc(100% - 64px); }
  .hero { gap: 28px; grid-template-columns: minmax(0,.82fr) minmax(0,1.18fr); }
  .hero-copy h1 { font-size: clamp(52px,6.6vw,65px); }
  .dash-content { padding: 28px; }
  .editor-layout { grid-template-columns: 1fr; }
  .preview-panel { position: static; }
  .preview-frame { height: 620px; }
}
@media (max-width:800px) {
  .dashboard { grid-template-columns: minmax(0,1fr); }
  .wrap { width: calc(100% - 40px); }
  .site-nav { padding: 20px 0; }
  .site-nav .brand--wordmark { width: 230px; }
  .site-nav:has(.brand--wordmark) .nav-links { top: calc(100% + 8px); left: 0; right: 0; }
  .brand-name { font-size: 23px; }
  .hero { grid-template-columns: 1fr; gap: 23px; padding: 45px 0 48px; }
  .hero-copy h1 { font-size: clamp(54px,9vw,76px); max-width: 600px; }
  .hero-copy > p:not(.eyebrow) { max-width: 500px; }
  .hero-art { width: min(580px,calc(100% - 16px)); margin: 8px auto 0; }
  .hero-photo-window { height: clamp(380px,75vw,520px); }
  .nav-links.open { background: #fff9fc; border: 1px solid var(--line); border-radius: 13px; box-shadow: 0 10px 25px #4c296017; padding: 20px; z-index: 20; }
  .nav-links .btn { margin-left: 0; }
  .journal-heading { grid-template-columns: 1fr; gap: 15px; }
  .journal-grid { grid-template-columns: 1fr 1fr; gap: 17px; }
  .journal-photo:nth-child(3n+2) { margin-top: 0; }
  .journal-photo:nth-child(even) { margin-top: 24px; }
  .journal-photo .photo-open img,.journal-photo:nth-child(3n+1) .photo-open img { height: 245px; }
  .section { padding: 58px 0; }
  .sidebar { width: 238px; }
  .sidebar.open { box-shadow: 10px 0 60px #35244535; }
  .dashboard-main { margin-left: 0; }
  .dash-content { padding: 25px 20px; }
  .dash-heading h1 { font-size: 36px; }
  .editor-fields { padding: 22px; }
  .photo-prompt { align-items: start; flex-direction: column; }
  .photo-prompt .btn { width: auto; }
  .about-image { transform: none; }
}
@media (max-width:500px) {
  .hero-copy h1 { font-size: 57px; }
  .hero-copy .eyebrow { font-size: 8px; letter-spacing: .12em; }
  .hero-copy > p:not(.eyebrow) { font-size: 14px; }
  .hero-actions { gap: 16px; }
  .hero-note { font-size: 9px; }
  .hero-photo-window { height: clamp(360px,100vw,440px); }
  .hero-photo figcaption strong { font-size: 21px; }
  .hero-photo figcaption { align-items: start; flex-direction: column; }
  .hero-photo figcaption > .icon { display: none; }
  .orbit-word { font-size: 8px; right: 12px; }
  .spark-one { left: -15px; font-size: 55px; }
  .spark-two { right: -7px; font-size: 43px; }
  .handwritten-note { font-size: 12px; }
  .journal-photo .photo-open img,.journal-photo:nth-child(3n+1) .photo-open img { height: 190px; }
  .photo-open { border-width: 6px; border-radius: 11px; }
  .journal-grid { gap: 12px; }
  .journal-photo figcaption { gap: 6px; font-size: 10px; flex-wrap: wrap; }
  .journal-photo figcaption small { width: 100%; padding-left: 21px; }
  .cta-band { padding: 35px 25px; }
  .cta-band h2 { font-size: 36px; }
  .photo-workflow { gap: 6px; }
  .photo-workflow > div { font-size: 9px; gap: 5px; }
  .photo-workflow b { width: 20px; height: 20px; }
  .editor-head-actions .btn { width: auto; }
  .editor-head-actions { gap: 8px; }
  .preview-tools { flex-wrap: wrap; gap: 8px; padding: 12px; }
  .tabbar button { padding: 9px 11px; }
}
@media (prefers-reduced-motion:reduce) {
  body::before,.cta-band { animation: none; background-position: 50% 50%; }
  .photo-open img { transition: none; }
}
@media print {
  body::before { display: none; }
}